vue实现动态列表点击各行换色的方法

  

<强>只是模拟一练习v v v-bind的一个简单演示

  

 vue实现动态列表点击各行换色的方法

  

  

遍历出数据里面的数据v

  

<强>给李加点击事件

  

绑定类样式怎么控制样式的显示

  

通过类的控制v:绑定:类={类:指数==变量}下标和类变量是否相等控制真假

  

        & lt; div id=坝τ谩北?   & lt; ul>   & lt;李v=(项目、索引)arr的v-bind: class=' {bg:指数==isactive} '   @click=' fn(指数)在{{项}}& lt;/li>   & lt;/ul>   & lt;/div>      & lt; script>   var vm=new Vue ({   埃尔:“#应用”,//el元素获取容器vue作用的范围   数据:{   isactive: 0,   加勒比海盗:['健康医疗”,“生活服务”,“信息安全”,“文化娱乐”),   },   方法:{   fn:函数(指数){//点击切换变量的值赋值为指标   console.log(指数);   this.isactive=指数;   }   }      })   & lt;/script>   之前      

以上这篇vue实现动态列表点击各行换色的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

vue实现动态列表点击各行换色的方法