vue.js更新整个阵列的最佳方法

更新整个观察到的数组并在vue.js中触发重新渲染器而不必迭代推送所有项的最佳方法是什么

我已经阅读了这里的文档：

---

但是，仅仅为了更新数组而进行过滤、浓缩或切片对我来说没有意义？一定有什么我错过了？

正如我建议的那样，我会亲自回复，以帮助处于同样困境的任何人

oldArr = newArr

仍然可以工作（谢谢。尽管在vue.js文档中有点不清楚。替换整个阵列不属于此处提到的范围（谢谢）

一个选项可能是清空阵列，然后按如下方式推送新阵列：

yourArray.push(... yourNewArray)

---

谢谢

我也遇到了这个问题，Vue 1.0中的许多示例代码给出了关于这个主题的错误信息。因此我认为在Janspeed关于这个主题的正确答案之后发布我的发现可能会有所帮助

例如，给定在

数据：

块中定义的数组，如下所示：

  data: {
    event: { name: '', description: '', date: '' },
    events: []
  }

要设置整个数组（在这些示例中，设置为a local array

var localEvents

），这两种方法都可以很好地工作，并且第二种方法具有更大的灵活性：

this.events = localEvents; // assigns array, is reactive
this.events = localEvents.slice(0, localEvents.length); // assigns array, is reactive

您将在教程中看到类似的示例，但它不起作用：

this.set$("events", localEvents)

这将导致以下错误：

Cannot set reactive property on undefined, null, or primitive value: events

Per:

但是，

Vue.set

可用于反应式地将元素添加到数组中。因此，给定长度为3的数组：

Vue.set(this.events, 4, newEvent); // adds newEvent to array reactively
this.events.splice(4, 1, newEvent); // also adds newEvent to array reactively

当然，根据文档中的示例，如果指定与现有数组元素对应的索引值，它将被您的输入对象替换（

newEvent

）

请参阅：

我只使用

this.myArray=this.myArray.slice（）

---

更新是什么意思？添加项、替换项或删除项？我的意思是用一个新数组替换所有项。那么为什么不直接像

oldArr=newArr

那样替换它呢？但是当您尝试它时会发生什么？（分配整个数组不是其中一个选项）这是一个有效的问题，可能对将来的参考很有用。你可以写下自己的答案来完成它。它不会为儿童调用组件更新，以防我将数组作为道具传递