vue初学备份(动态切换class类)

<div id="app">
  <div v-bind:class="[ isActive ? 'active':'']" @click="clickActive"></div>
  {{isActive}}
  <div v-for = "(item,index) in actvieArray">
  <p v-bind:class = "[isActive&&ind==index? 'active':'']" @click="arrayActive(index)" >{{item}}</p>
  </div>
</div>
<script type="text/javascript">
  let vm = new Vue({
  el:'#app',
  data:{
    isActive:false,
    actvieArray:["测试了1","测试了2","测试了3","测试了4"],
    ind:-1,
    /*isAcrtive:true*/
  },
  methods:{

    clickActive:() =>{
      let that = this
      vm.isActive = !vm.isActive;// zhe di 方是可行的....
    },
  arrayActive:(index) => {
    console.log(index,this)
    vm.ind = index;
    vm.isActive = true;
  }
 }
})

</script>

uniapp...

<image src="../../static/details/play&&pause.png" mode="" :class= "[isActive&&indexImg == ind?'active':'']"  ></image>

  clickStart (ind) {
    //手指点击上;
    let that = this;
    that.indexImg = ind;
    that.isActive = true;
   },
  clickEnd (ind) {
    //手指点抬起;
    let that = this;
    that.indexImg = ind;
    that.isActive = false;
  }

原文地址:https://www.cnblogs.com/yangyang520/p/11603931.html