Javascript v-for和自定义组件的未定义行为

首先，请原谅这个糟糕的代码（我们现在没有时间修复）。我知道

eval

很可怕，但就我们的目的而言，这是唯一一件对我们如此容易奏效的事情

以下是添加和删除行的方式：

methods: {
    addRow: function() {
        let lastRow = eval(`this.$parent.json${this.path}[this.$parent.json${this.path}.length - 1]`);
        lastRow = Object.assign({}, lastRow);
        eval(`this.$parent.json${this.path}.push(lastRow)`);
        this.$forceUpdate();
    },
    removeRow: function(index) {
        //eval(`this.$parent.json${this.path}.splice(index, 1)`);
        eval(`Vue.delete(this.$parent.json${this.path}, index)`);
        this.$forceUpdate();
    }

要重新创建问题，请添加一行。然后，更改新行上的文本。尝试删除倒数第二行-注意它不会被删除，但最后一行是。但是，如果您检查json调试，它是后端数据的实时视图，您将看到正确的行被删除

为什么会发生这种情况？为什么UI和后端不同步？

使用

v-for进行迭代时，应始终使用a。尝试添加这样一个

<div class = "well" v-for = "item, index in items" :key="item">


使用
v-for进行迭代时，应始终使用a。尝试添加这样一个

<div class = "well" v-for = "item, index in items" :key="item">