Javascript Vuejs Es6级反应性

我正在尝试在vuejs中将计算属性与es6类关联。 我的Vue实例如下所示：

...
props: ['customClass'],
computed: {
    localClass: {
         get() {
             return this.customClass
         },
         set (value) {
             console.log("changed")
         }
     }
 }
 ...

我的班级看起来像这样

class CustomClass {
    constructor () {
        this.selected = false
    }
}

如果我尝试这样做：

this.localClass.selected = true

但是二传手从来没有被呼叫过，就像反应性已经丧失，我不明白为什么

我还尝试：

Vue.set(this.localClass, 'selected', true)

我将customClass作为道具传递，但即使直接在组件中创建新实例，也不会改变结果

在vuejs文档中，我不记得有一节讨论es6类中的反应性问题，所以我想知道是否有人知道为什么以及如何使我的类反应性

---

提前感谢

当您分配给某个计算属性（例如

this.mycomputerdproperty={something:'else'}

）时，会触发该属性的设置程序，例如

mycomputerdproperty

您可能正在寻找的是一个，例如：

watch: {
  localClass: {
    deep: true,
    handler() {
      out.innerHTML += "watched!";
    }
  }
},

下面是演示

class自定义类{
构造函数（）{
this.selected=false
}
}
Vue.component（'自定义'{
模板：“#自定义”，
道具：['customClass']，
计算：{
本地类：{
得到（）{
返回此.customClass
},
设置（值）{
out.innerHTML+=“已更改！\n”；
}
}
},
观察：{
本地类：{
深：是的，
handler（）{
out.innerHTML+=“被监视！\n”；
}
}
},
方法：{
转让给选举产生的（）{
this.localClass.selected=true
},
assignToLocalClass（）{
this.localClass={
所选：真
}
}
}
});
新Vue({
el:“#应用程序”，
数据：{
测试：新CustomClass（）
},
})

#out{背景：黑色；颜色：灰色；}
span{font size:x-small；font-family:verdana}

{{localClass}}


分配给选举
注意：只会触发一次“watched！”，因为，由于该值是在方法中硬编码的（请参见代码），因此后续单击不会修改该值。



分配局部类
注意：assignToLocalClass（）将触发计算设置程序，但不会触发观察程序，因为计算设置程序当前未设置任何内容，因此观察程序不会触发任何更改。

您没有设置

localClass

，这将激活setter，您正在设置

localClass

的一个成员，而这不会激活setter。