如何从模板中设置v-if属性

Question

我想知道是否可以从模板中设置v-for中的属性。具体来说，原始数组中不存在story.verifyDelete，但我在点击时将其设置为true似乎不会激活其上方的v-if="story.verifyDelete。

<div v-for="story in stories">
    <div v-if="story.verifyDelete == true">
      <div>Are you sure you want to delete this story?</div>
      <div @click="remove(story.id)">Delete</div>
      <div @click="story.verifyDelete=false">Cancel</div>
    </div>
    <div @click="story.state == 'published' ? read(story) : edit(story)">{{ story.title }}</div>
    <div @click="story.verifyDelete = true">Delete</div>
</div>

Answer 1

对象不会被普通的setter =或[]在vue中反应。

在Delete div的click处理程序中，您需要执行一个set以让vue注意到值更改

this.$set(this.story, 'verifyDelete', true)

https://vuejs.org/v2/guide/reactivity.html