关于vue.js:vue点击获取当前元素

1. 开发环境 vue
2. 电脑系统 windows10 专业版
3. 在开发的过程中, 咱们常常会进行一些款式的操作, 然而又不想应用原生的办法获取元素, 上面我来分享一下我的解决办法, 心愿对你有所帮忙。
4. 需要: 在点击按钮, 奇数次的时候背景色为红色, 偶数次的时候背景色为红色, 上面我剖析一下如何实现, 废话不多说, 间接上代码:

// 在 return 中定义两个值
selectmoney: {
  // 定义 点击次数
  num: 0,
}

5. 在 template 中增加如下代码:

<p v-for="(sitem,sindex) in $cJs.stringarr(item.support_amount_range)"
 :key="sindex" 
 v-if="item.name!=' 网银转卡 '"@click="selecttopup($event)">
{{sitem}}</p>

// 要害代码为: 
@click="selecttopup($event)"

6. 在对应的办法中进行输入:

   selecttopup(e) {console.log("我是传进来的 e 的值");
    console.log(e);
    console.log(e.target);
    console.log("我是传进来的 e 的值完结啦");
    this.selectmoney.num += 1;
    if (this.selectmoney.num % 2 == 0) {console.log("我是偶数的状况");
     console.log(this.selectmoney.num);
     console.log("我是偶数的状况完结啦");
     e.target.style.backgroundColor = "#fff";
    } else {console.log("我是奇数的状况");
     console.log(this.selectmoney.num);
     console.log("我是奇数的状况完结啦");
     e.target.style.backgroundColor = "#FED2D6";
    }
   }

// 打印传进来的 e
// 打印传进来的 e.target 是你以后点击的元素 

 这样咱们在点击的时候的时候就能够获取以后的元素, 而后判断几次的次数是偶数还是奇数, 进行对应的批改背景色。

7. 本期的分享到了这里就完结啦, 心愿对你有所帮忙, 让咱们一起致力走向巅峰。