v-for中动态绑定样式
问题描述:
原有代码是多个li标签,其中第一个li标签中的字体为红色,其他为默认样式,我们改为v-for后所有的li标签都延续了原来第一个li标签的样式,怎么才能在使用v-for的同时,动态绑定样式呢?如图:
我么在li中使用了v-for,在下一级的a标签中,我们动态绑定一个class并且传入一个数组floorCss
然后我们在data中对该数组进行定义,元素floorCss1在数组中的索引值为0
所以我们修改css代码,即可实现v-for遍历后第一个li标签的字体为红色
当然,如果需要对后面的li标签样式也进行动态绑定,我们在数组中多加几个元素即可,floorCss:["floorCss1","floorCss2","floorCss3",……],然后分别编写"floorCss2","floorCss3",……的样式即可