其他分享
首页 > 其他分享> > Vue如何给V-for的某个标签添加样式

Vue如何给V-for的某个标签添加样式

作者:互联网

使用场景

封装了一个导航栏,其中的个别选项的样式需要单独调整,但是标签是V-for生成的怎么办呢?

代码展示

 <div  v-for="(item, index) in items" :key="index">
      <div :class="itemsstyle[index]">{{ item }}</div>
  </div>
  在vue实例对象中的data里
  data(){
  	 itemsstyle: ["item0", "item1", "item2", "item3", "item4"],
  }
  根据下标可以为每一个标签绑定我们想要的类名
  <style>
.item0 {
  background-color: red;
}
.item1 {
  background-color: pink;
}
.item2 {
  background-color: green;
}
.item3 {
  background-color: yellow;
}
.item4 {
  background-color: gray;
}
  </style>
  

标签:Vue,样式,标签,item0,item1,color,background,data
来源: https://blog.csdn.net/m0_47195133/article/details/122028217