【vue】v-for给循环出来的div设置不同的背景色
第一步:给要循环的盒子动态绑定class名 并且传入一个数组<div v-for="(i,a) in serve" class="sever_box2"><div :class="sstt[a]">吧啦吧啦</div></div>第二步:在data中定义这个数组data() {return {sstt: ["ss1"
·
第一步:给要循环的盒子动态绑定class名 并且传入一个数组
<div v-for="(i,a) in serve" class="sever_box2">
<div :class="sstt[a]">
吧啦吧啦
</div>
</div>
第二步:在data中定义这个数组
data() {
return {
sstt: [
"ss1",
"ss2",
"ss3",
"ss4",
]
}
第三步:在style中分别设置颜色
.ss1{
background: #71b262;
}
.ss2{
background: #6288b2;
}
.ss3 {
background: #ecac60;
}
.ss4{
background: #f87171;
}
更多推荐
已为社区贡献5条内容
所有评论(0)