Vue js带有反跳的监视对象

Question

我在组件内有3个道具的数据对象localFilter，我需要注意的是在该对象内更改任何道具并在1秒钟内反跳。 如果我有一个属性，则下面的代码有效，但是当我需要带有反跳的整个对象监视程序时，最好的方法是什么？

export default {
  name: "my-search",
  data: () => ({
    localFilter: null
  }),
  props: {
    value: {
      type: Object,
      required: true
    }
  },    
  watch: {
    'localFilter.searchText': _.debounce(function() {
      console.log(this.localFilter);
      this.$emit("input", Object.assign({}, this.localFilter));
    }, 1000)

Answer 1

您可以深入观察物体：

watch: {
    // any prop or data or $props or $data
    $props: {
        deep: true,
        handler: _.debounce( /*...*/)
    },
}