利用v-for循环出的多个li标签，点击不同的li变换颜色

方法一

    <ul v-for="(item,index) in list" :key="index" class="details"><li ref="lisd" @click="faillist(index)" :class="{'active':ind === index}">{{item.msg}}</li></ul>data() {return {list: [{msg: "用户管理"},{msg: "用户列表"},{msg: "用户输入"},{msg: "菜单选项"}],ind:''};},methods:{faillist(index){this.ind = index}},
复制代码

方法二

• vue项目引入jquery npm i jquery --save
  这样全局就可以使用jquery啦。

<ul v-for="(item,index) in list" :key="index" class="details"><li ref="li" @click="faillist($event)">{{item.msg}}</li>
</ul>methods: {faillist(e) {//使用e.currentTarget获取当前被点击的元素let Dom = e.currentTarget;$("li").removeClass("active")$(Dom).addClass('active')console.log(Dom2)}},
复制代码

• 这样就实现了点击不同的li标签实现了变颜色

vue里面$set() 方法

作用：给data里面定义的对象添加新的属性以及value值
语法：this.$set(this.obj,'age',24)

    data(){return {student{name:'张三'，sex:'男'}}}mounted(){this.$set(this.student.age,24)}console.log(this.student)==>{student{name:'张三'，sex:'男',age:24}}
复制代码

• end$set() 方法