标签：vue-js javascript

我正在尝试观察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

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。