Question

由于某些原因，Vuejs不会深入监视更改。假设下面是我正在查看的数据。

input_collection: [
    {
        type: 'foo',
        value: 'foo'
    },{
        type: 'bar',
        value: 'bar'
    },{
        type: 'baz',
        value: 'baz'
    }
]

基本上是一个对象数组。当我更改除最后一项以外的任何内容时，它将触发手表执行其工作。但是当最后一项更新时，它不会更新。

更改input_collection内容的方法是使用v-model并直接更改代码中的值。我也怀疑直接更改方法是罪魁祸首，因为我只在最后一个项目中使用了此方法，并且输入具有只读属性，但是由于我直接为项目的内容分配了新值，因此不应有问题。

//via v-model
<input :type="type" v-model="title"/>

//via directly changing
<input type="type" :value="value" readonly>
//js
this.input.title = new_value;
this.value = new_value;

我尝试通过Vue Devtools扩展名手动更改最后一项内容中的最后内容，但仍然无法正常工作。

Answer 1

我知道了。原来是readonly引起了我的问题。我只是通过以下方法创建了一个解决方案：

//markup
<input type="text" v-model="input.value" @keypress.prevent>
//js
this.input.value = new_value

现在，观察者可以正常工作。

Vuejs-观察者没有足够深入地观察

1 个答案: