Javascript 什么'；这是更新Vue组件实例上的道具的正确方法

我试图找出更新组件实例上创建的propsData的最佳方法。基本上，我有一个签名包装页，并收到一堆使用

v-html

呈现的html。然后，我在呈现的html中创建数量可变的签名板组件。因为我不知道html将是什么，我被迫（我能说的最好）在安装后动态创建组件

因此，我在父级

mounted（）

上运行以下命令：

---

据我所知，propsData现在静态地设置在组件上。但是对于

signatureData

和

editable

道具，我需要能够在更新时将其传递给子组件。观察者工作正常，道具正在更新，但我得到了

避免直接变异道具的警告。这是可以理解的，因为我直接改变了孩子身上的道具。有什么好办法处理这个问题吗？
在我找到这个之后，我就能够解决这个问题了。在
propsData
上设置道具时，我使用的是所有基本类型，因此它们没有内置的反应式getter和setter。现在我意识到，我所做的相当于将一个字符串作为道具传递给一个组件元素。在我这样做之后，道具是被动的，我不必费心手动创建观察者

无论如何，这就是解决方案：

const SignaturePadInstance = new SignaturePadClass({
    parent: this,
    propsData: {
        fieldName: id, // << primitive
        editable: true, // << primitive
        signatureType: signatureType, // << primitive
        signatureIndex: length - 1,  // << primitive
        createdSignature: this.createdSignature  // << reactive object, updates to the child when changed
    }
});

const SignaturePadInstance=新SignaturePadClass({
家长：这个，
propsData：{
fieldName:id，//我使用Vue.observable（VueJS 2.6及更高版本）使属性具有反应性。下面是一个完整的示例：

    initializeSignaturePad() {
       const signaturePadComponent = Vue.extend(SignaturePad)
       this.instance = new signaturePadComponent()
       instance._props = Vue.observable({
          ...instance._props,
          editable: true
       })
       this.instance.$mount()
       document.body.appendChild(instance.$el)
    }
    
    onSignatureAccepted {
        this.instance.editable = false
    }
        

我真的不明白你的代码应该做什么，因为我不知道
propsData
是什么。但是组件中的道具不应该在组件中更改。组件应该在需要时（当父级更改动态道具时）侦听道具中的更改，但组件本身不应更改道具。我理解在正常流程中，但我必须使用构造函数创建子组件，该构造函数接受
propsData
来初始化道具。这篇文章是我使用此方法的部分内容。如果要将道具的值更改为孩子们，你应该为组件创建一个
数据
对象，改为更改这些值，并将它们绑定到孩子们。好的，我确实设置了它，让家长直接更新孩子们的数据对象，这很有效，但这似乎与Vue的道具下降、事件上升模型背道而驰。似乎应该有一种方法来模拟当以编程方式创建组件时，将道具传递给组件的标准反应式方法。是的，我还没有处理过动态创建的实例，所以在这方面我帮不了什么忙。但问题是，如果您面临的问题是必须将道具传递得太深，也许您应该尝试使用状态容器。在Vue的情况下，Vuex。嘿，想知道您是否可以详细介绍this.createdSignature是如何变为被动的？我正在尝试实现同样的效果，但即使我将props的值设置为this.prop，子项也不会更新。@danbrellis使用Vue.observable。请参阅我的答案工作片段：
    initializeSignaturePad() {
       const signaturePadComponent = Vue.extend(SignaturePad)
       this.instance = new signaturePadComponent()
       instance._props = Vue.observable({
          ...instance._props,
          editable: true
       })
       this.instance.$mount()
       document.body.appendChild(instance.$el)
    }
    
    onSignatureAccepted {
        this.instance.editable = false
    }