我如何处理我的 vue 组件中更改的任何数据?

How can I handle any data changed in my vue component?

我知道我可以 'watch' 在我的 data 中更改 vue 中的特定属性,但是是否可以处理 任何 组件数据更改的部分?

比如我有:

data() {
   return {
     myProp: false,
     myOtherProp: true
   }
}

我可以这样加手表:

 watch: {
    "myProp": function(val, oldVal) {
      // Do something
    }
}

也可以为 myOtherProp 添加一个处理程序,但实际上我有很多属性,如何为所有添加一个处理程序?

更多上下文

这里的最终目标是检测 'dirty' 状态,这样我就可以确定是否警告用户他们可能会丢失未保存的更改。

我试过的

我知道我可能可以将我在数据中的所有属性组合成一种类型,然后观察一下,但目前这种改变太具有破坏性,风险太大。我很好奇全局处理程序是否可行。

最简单的方法是创建一个 computed 属性,当这个 属性 改变时你可以调用你的函数:

computed: {
    hash () {
      return `${this.myProp}
          |${this.myOtherProp}
   }
},
watch: {
   "hash": function(val, oldVal) {
      // Do something
    }
}