How can you implement dynamic class change in vue on multiple elements?

Question

Arrays

Hello, tell me, please, I have an array of messages in the chat and I display them in a loop, I also want to implement message selection by adding and removing the isActive class to the "i" tag, I can't figure out from the documentation if I make a variable one , then all messages are highlighted, but how to do something like checkboxes?

<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;
}