vue中v-for通过动态绑定class实现触发效果

vue动态绑定class练习。

：class=“{ ‘类名1'：条件表达式，‘类名2'：条件表达式… }”

.item {
 display: inline-block;
 width: 100px;
 height: 100px;
 cursor: pointer;
 border: 1px solid black;
}
.item:hover {
 background: gray;
}
.item.click {
 background: red;
}

补充：vue之v-for中给每个item动态绑定class，动态添加元素，动态删除某个元素的实现

主要解决了在v-for时，如何给每个item添加动态的样式，即是说，鼠标滑动到某一项时，可以单独改变某一项的样式，同时添加按钮等操作。以及删除某一项的操作。

h1, h2 {
 font-weight: normal;
}
ul {
 list-style-type: none;
 padding: 0;
}
li {
 
 margin:10px;
}
a {
 color: #42b983;
}
.defaultClass{
  background-color: red;
}

总结

以上所述是小编给大家介绍的vue中v-for通过动态绑定class实现触发效果，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对考高分网网站的支持！