<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <style> .red { color: red; } </style> </head> <body> <script src="js/vue.js"></script> <div id="app"> <h2>请选择你的爱好：</h2> <ul style="list-style: none; "> <li @click="red(i)" :class="{red:(index == i)}" v-for="(item,i) in array">{{item}}</li> </ul> </div> <script> const app = new Vue({ el:"#app", data:{ array:["唱歌","睡觉","跆拳道","跑步","羽毛球","滑雪","下棋","游泳"], index:0 }, methods:{ red:function (i){ this.index = i; console.log(this.index +" --- " + i); } } }) </script> </body> </html>
emmmmmm 其实用到了一个 判断的思维吧.