vue中v-for和v-if结合的问题？

Question

利用v-for遍历出N个关注按钮，点击其中一个关注按钮，对应的关注按钮变成已关注，第一次是这么做的

 <img v-if='flag' @click='change()' :src='countries[num]' alt="">//关注

    <img v-if='!flag' :src='countriesHasAttention[num]' alt="">//  已关注

    data () {

        return {

            flag: true

        }

    }    

    change: function () {

        this.flag = false

    }

    

发现点击一个全都改变了，然后我把flag改成了一个数组

<img v-if='flag[index]' @click='change(index)' :src='countries[num]' alt=""> //关注

<img v-if='!flag[index]' :src='countriesHasAttention[num]' alt="">    //  已关注

data () {

        return {

            flag: [true, true, true]

        }

}   

change: function (index) {

        this.flag[index] = false

}

发现这样做点击的时候按钮不发生变化。

求大神指导一下

Answer 1

change部分改为Vue.setchange(index){ &nbsp;&nbsp;&nbsp;&nbsp;Vue.set(this.flag,index,false) }