直接上代码
利用currentIndex来判断哪个元素被点击了
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <style>
7 .active{
8 color:red;
9 }
10 </style>
11 </head>
12 <body>
13 <div id="app">
14 <ul>
15 <li v-bind:class="{active:currentIndex === index}"
16 v-for="(item,index) in movies" v-on:click="change(index)">{{item}}
17 </li>
18 </ul>
19 </div>
20 <script src="../../js/vue.js"></script>
21 <script>
22 const app = new Vue({
23 el:"#app",
24 data:{
25 movies:["海王","海尔兄弟","火警忍者",‘进击的巨人‘],
26 currentIndex:0
27 },
28 methods:{
29 change: function (index) {
30 console.log(this.currentIndex)
31 this.currentIndex=index
32 }
33
34 }
35 })
36 </script>
37 </body>
38 </html>
原文：https://www.cnblogs.com/FangGeQue/p/11988028.html