要求:一个点击谁时,谁就变成红色
<body>
<div id="app">
<!-- 作业是一个点击谁时,谁就变成红色,可以绑定类,用对象的方法,使用布尔值来确定 -->
<ul>
<li v-for="(item,index) in movies" :class="{active:currentIndex===index}" @click='liClick(index)'>{{item}}</li>
</ul>
</div>
<script src="../vue.js"></script>
<script>
const app = new Vue({
el: "#app",
data: {
movies:['海王','海贼王','加勒比海盗','海尔兄弟'],
currentIndex:0,//记录状态
},
methods:{
liClick(index){
this.currentIndex=index;
}
}
})
</script>
</body>