1>
<ul> <li v-for="n in 6" :class="'item'+n">{{n}}</li> </ul>
2>
每个节点应该定义了type
<div v-for="item in list" class={'classA': item.type === 'type1', 'classB': item.type === 'type2'}>node</div>
3>
比如我们有一个列表，我们希望能显示我们当前选中的那一个，如何实现呢？
基本思路是通过$index来判断是否是当前迭代对象，然后去增减class或者style来实现不同的样式
<ul>
<!-- 方法1 class-->
<li v-for="item in list" :class="{'active': $index === activeId}">{{item}}</li>
<!-- 方法2 style-->
<li v-for="item in list" :style="{backgroundColor: $index === activeId ? 'red' : 'white'}">{{item}}</li>
</ul>
data () {
return {
list: ['a', 'b', 'c'],
activeId: 0
}
},
