Vue.js v-for循环绑定数组中的项目对象并根据更改进行更新

问题描述

我有一个组件，并且正在使用v-for循环来循环，并在应用程序的$root级别使用对象数组来填充列表。

在我应用程序的其他组件中，我将EventBus.$emit数据更新数据库中的表。这意味着$ root数组数据将更新。

是否可以绑定或映射我创建的v-for列表，以使用索引或其他方法进行检测和更新？

这是示例循环和示例$root数据。

我想我希望有一种方法可以使用[index]

连接数组中的对象

<v-list-item-content v-if="this.$root.people">
  <div v-for="(item,index) in this.$root.people" :key="item.id">
    <div>
      <span v-html="this.$root.people[index].value"></span>
    </div>
  </div>
</v-list-item-content>

我的数组看起来像这样。

people:Array[2]
 0:Object
  event_id:6
  submission_values:Array[4]
   0:Object
    value:"Danny"
   1:Object
   2:Object
   3:Object

解决方法

我想如果people已经反应了，那么您应该看看如何更新此数组。关于在VueJS中更新反应式数组的一些警告，请查看the official documentation