Vue 监视嵌套对象和每个道具

【问题标题】：Vue watch nested object and each propVue 监视嵌套对象和每个道具
【发布时间】：2019-03-13 01:21:29
【问题描述】：

我有一个想要被监视的嵌套对象。这是代码：

watch: {
        'input.source.location': {
            handler: () => {
                console.log("locations");
            }
        },
        'input': {
            handler: () => {
                console.log("all the rest");
            },
            deep: true
        }
    },

通过更改 location 属性，我希望只打印“位置”。我该怎么做？

谢谢

【问题讨论】：

标签： javascript vue.js vuejs2 vue-component watch

【解决方案1】：

不是 100% 确定这是正确的答案，但这会起作用。我不知道 vue 是否有任何参数可以直接支持您的情况，而无需在 if 语句中使用。

watch: {
        'input.source.location': {
            handler: () => {
                console.log("locations");
            }
        },
        'input': {
            handler: (newVal) => {
                if(newVal.source.location) return;
                console.log("all the rest");
            },
            deep: true
        }
    },

-或-

watch: {
        'input': {
            handler: (newVal) => {
                if(newVal.source.location) console.log("locations");
                else console.log("all the rest");
            },
            deep: true
        }
    },

【讨论】：

这行不通。如果没有更新，newVal 对象将包含嵌套的 props 事件。