利用Vue的v-for和v-bind实现列表颜色切换

需求： 在页面上显示四个列表，初始时字体为黑色。 鼠标点击某一个列表时，该列表的颜色变为红色，其余列表仍为黑色。 代码实现： &lt;!-- css --&gt; &lt;style&gt; .red{ color: red; } &lt;/style&gt; &lt;!-- html --&gt; <div id=app> <ul> <li v-for=item,index class={red: xss=removed v-on:click=change(index)>{{item}}</li> </ul> </div> &lt;!-- JavaScript --&gt; &lt;scr