javascript-Vue.js观察深层属性
作者:互联网
我正在尝试观察vue.js对象的属性,但是我没有得到想要的结果,我的代码如下:
var vueTable = new Vue({
el: '#vue-table',
data: {
filters: {},
},
watch: {
filters: {
handler: function () {
console.log('watched');
},
deep: true
}
}
}
我在输入上有一个v模型,如下所示:
<input class="form-control" v-model="filters.name">
现在,当页面加载时,它只会在控制台中查看一次日志,每当我更改输入时,它都不会记录任何内容.
但是当我把vueTable.filters = {name:’something’};表格初始化后,它将在每次更改时触发.
这是意外行为吗?还是我们必须定义所有属性才能对其进行监视?
解决方法:
文档涵盖了here.
Due to the limitations of modern JavaScript (and the abandonment of
Object.observe), Vue cannot detect property addition or deletion.
通过从一个空对象开始并将v-model设置为filters.name,最终可以动态添加一个属性.在这种情况下,最好的方法是初始化数据中的属性.它不必具有价值.
data: {
filters: { name: null },
}
标签:vue-js,javascript 来源: https://codeday.me/bug/20191111/2018397.html