<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;
}