Question

我知道，为了使对象或数组在Vue中具有反应性，必须在根数据结构上定义其属性。

将对象数组添加到根数据结构上定义的预先存在的变量中，并使该数组中每个元素的每个属性具有反应性的最佳方法是什么？

我尝试遍历数组并将每个数组添加到根数据模型，即：

these_terms.forEach(function(term, idx) { term.selected = false; Vue.set(vm.game.set,idx,term); });

但是，Vue稍后更改后，仍然不响应“ term.selected”属性。

是否有更好的方法可以实现我的目标，还是需要使用$ forceUpdate？（该手册说，在99％的情况下使用$ forceUpdate时，您做错了，因此此信息）

Answer 1

在父组件上，执行以下操作：

使用开头为空数组的数据属性
制作一个调用方法的按钮
在该方法中，推送到空数组。

第3步示例

    methods: {
      _addGroup: function() {
        let result = {
          id: this.wizardGroups.length + 1,
          name: '',
        };
        this.wizardGroups.push(result);
      },

如果之后需要添加其他属性，则可以遍历对象数组并应用Vue.set()

Answer 2

对不起，如果我理解错了，但是为什么不导入数组并将其放入Vue数据变量中呢？

import xx from "xxxx.js"

export default {
    data() {
        return {
           y: xx
         }
      }
}

向Vue动态添加对象数组（反应性问题）

2 个答案: