Здравствуйте, подскажите, пожалуйста, у меня есть массив сообщений в чате и я их вывожу в цикле, так же хочу реализовать выделение сообщения путем добавления и удаления класса isActive тэгу "i", я никак не могу сообразить по документации, если я делаю переменную одну, то у меня выделяются все сообщения, а как сделать что-то типа чекбоксов?
<div v-for="msg in msgs" >
<div :data-id="msg.id" @click="addToArrBeforeDeleteMsg">
<i v-bind:class="[{ 'isActive': item[msg.id], 'checkMsg':true, 'far': true, 'fa-check-circle': true } ]"></i>
</div>
</div>
export default {
data() {
msgs: [{id:1},{id:2},{id:3}...]
item: []
}
methods: {
addToArrBeforeDeleteMsg(e) {
this.item[e.target.dataset.id] = true
}
},
}
}
.isActive {
display: inline-block!important;
color: rgba(53, 87, 97, 1)!important;
font-size: 20px;
}
Простой
