vue一次性为多条评论(或者其他)点赞（收藏）改变标签样式的方法

用途：如图，可以一次性将所有心点亮或者变灰，达到互不影响效果。

• 方法一：操作数据：
  第一步：在点击❤（字体图标）的时候，调用函数，对进行v-for循环的数组中添加属性color，值为red.
  例： this.$set(this.images[index], “color”, “red”);
  第二步：设置动态样式 :class="{‘red’:‘active’}[item.color]"，当数组元素中有color为red时，class=‘active’

方法一：
 <span @click=" activeLike(index)">
 <span><i class="fa fa-heart" :class="{'red':'active'}[item.color]"></i></span>
</span>

 activeLike(index) {
        if (typeof this.images[index].color!=="string"){
          this.$set(this.images[index], "color", "red");
          console.log(typeof this.images[index].color=="string");
        }else {
          // this.$set(this.images[index], "color", "2");//需要一起，delete才能去更新视图
          //vue.$set([想要添加字段的对象],'字段名',字段值)
          //delete this.namelist.name;//js方法,无法触发更新视图，
          this.$delete (this.images[index],"color")//vue方法，可以更新视图
          // console.log(this.images[index]);
        }
        样式：
          .active{
          color: #d10034;
        }
    

方法二
html代码
 <span @click=" activeLike(index)">
```<span><i class="fa fa-heart" :ref="index"></i></span>
 </span>

js代码
 activeLike(index) {
 if(this.$refs[index][0].style.color === "rgb(209, 0, 52)")
 { //this.$refs[index]是变量绑定的方法
  //this.$refs.name是常量绑定的方法
          this.$refs[index][0].style.color = "#9fadb6"
        }else {
          this.$refs[index][0].style.color = "#d10034"
        }