vue.js怎么动态的添加class名称以及判断只给对应的一个添加

<div id="listRendering">
<ul>
<li v-for="(listRenderingList,index) in listRenderingLists" v-on:click="onclick(index)" v-bind:class=" {active:index==dynamic}">{{index}}{{listRenderingList.text}}</li>
</ul>

</div>

var listRenderingVm=new Vue({
el:'#listRendering',
data:{
listRenderingLists:[{
text:'Foo'
},{
text:'Bar'
},{
text:'Foo Bar'
}],
isActive:false,
dynamic:-1 //当点击时候点亮，同级的li标签删除Class.dynamic的值是可以改变的，默认第一个被选中就写0
},
methods:{
onclick:function(index){
// console.log(index);
// 给index为1的加字体颜色,其他的不加
// if(index==1){
// this.dynamic = index;
// }
//点击添加字体颜色，其他的删除class名称
this.dynamic = index;
}
}

});