Typescript 强制vue.js刷新道具时'；的子属性已更改

我有一个绑定到对象上的组件，父组件更改其对象的属性。子组件应该对更改作出反应

子组件：

import { Component, Emit, Inject, Model, Prop, Provide, Vue, Watch } from 'vue-property-decorator'

@Component({
    props: {
        value: Object,
    }
})
class ValidatedSummaryComponent extends Vue {
    value: any;
    field = "Name";
    v: any;

    created() {
        console.log("!", this.value);
        this.v = this.value;
    }

    state: string | null = null;
    error = "";

    @Watch('value')
    onValueChanged(val: any, oldVal: any) {
        console.log("Value called", val);
        this.v = val;
        this.onChanged();
        this.$forceUpdate();
    }

    private onChanged() {
        if (typeof this.v.validationErrors[this.field] == 'undefined') {
            this.state = null;
            this.error = "";
        } else {
            this.state = 'invalid';
            this.error = this.v.validationErrors[this.field].join();
        }
    }
}

export default ValidatedSummaryComponent;

用法：

<ValidatedSummary v-bind:value="bindableObject"></ValidatedSummary>

我需要我的组件

ValidatedSummaryComponent

做出反应

我可能可以将其作为单独的属性进行绑定：

，但是在最终设计中，组件应该注意

BindableObject

的所有属性，并且会有一些不同的

BindableObjects

具有不同的属性集，因此我不能只按属性绑定它。

我设法使其工作的唯一方法是强制vue.js更新整个对象，确保vue.js平等性检查不通过：

this.bindableObject = Object.assign(new BindableObject(), this.bindableObject );

但这是非常麻烦的，因为我将不得不这样做的每一个变化，所以我正在寻找一个更好的方式来处理这个问题。

---

删除

this.$forceUpdate（）在上面的代码中，但我可以用它生存。
好吧，只需执行强制更新。这会让你的生活更轻松

vm.$forceUpdate();

如文件中所述

强制Vue实例重新渲染。请注意，它不会影响所有项目
子组件，仅实例本身和具有
插入的插槽内容

但是，只有当您没有其他选项（仅作为最后一个选项）时，才建议使用此选项

那么，您还可以使用哪些其他选项使其工作。（取决于代码设计）

尝试使用Vue.set（）。或者
重新分配已更改的对象
将我的评论转换为答案

您可以尝试使用
watch
的
deep
选项，如@MartinBean中所示，我知道这一点。该对象在子组件之外被完全观察并完全发挥功能。您可以尝试使用
watch
的
deep
选项，如手册@IVOGELOV Wow！所示！这正是我想要的。如果你可以把它作为一个答案-我会接受iTunes的，这并不总是导致更新，也没有帮助我在我的情况下。我有a）一个具有props的组件b）深度依赖性c）设置为props的实体通过vuejs相等性检查，这也会阻止它刷新。不确定这三个或全部中的哪一个，但这就是造成我问题的原因
vm.$forceUpdate();