Question

我需要动态地向数据添加新属性，因此我正在使用this.$set对这些新数据进行Vue跟踪。使用this.$set的大多数代码都能正常工作，但是其中之一会导致意外的行为。

假设我有一个组件component，它最初包含数据a = {}。

然后，我单击按钮以向b添加新属性a。我使用this.$set(a, b, {value: 123})来保持Vue跟踪a.b的值。但是，当存在多个组件或创建新组件时，a.b的值将复制到所有组件。因此，当我在一个组件上更新或删除其值时，它将应用于所有组件。

我试图使密钥b在不同组件之间是唯一的（例如a.b-comp1，a.b-comp2，a.b-comp3），但是没有运气。另外，如果我向一个组件添加另一个新属性，它将添加到所有组件。我可以看到这样的结果：

a: {
    b-comp1: 123,
    b-comp2: 234,
    b-comp3: 345,
    c-comp2: 123,
    d-comp3: 345
}

这是JSFiddle中的原始代码。使用菜单时存在问题。使用“语音和音频”（类似于“菜单”）没有问题。单击右下角的加号以添加新属性。