Reactjs 如何在mobx中订阅@computed object？

我想订阅一个返回简单对象的计算属性

代码沙盒：

我举了一个简单的例子来说明我的情况，以确切说明问题所在：

const zeroSize={
宽度：0，
身高：0
};
类项目{
@可观察尺寸=零尺寸；
}
类集合{
@可观察儿童：项目[]=[]；
@计算的获取大小（）{
返回this.childrens.length>0&&this.childrens[0]？this.childrens[0]。大小：zeroSize；
}
构造函数（）{
反应（（）=>this.size，size=>{
//应为{宽度：0，高度：1000}
//实际{宽度：0，高度：0}
log（'----size='，toJS（size））；
});
}
}
const item1=新项目；
const collection1=新集合；
收集1.儿童推送（项目1）；
项目1.size.height=1000；

---

您正在收听错误的更改

由于您正在侦听大小的更改，因此高度将触发更改：

const item1 = new Item; // size === 0
const collection1 = new Collection; // size === 0
collection1.childrens.push(item1); // size === 1 (triggers reaction)
item1.size.height = 1000; // size === 1 (doesn't trigger reaction)

如果您想收听由

childrens

更改引起的任何和所有更改，那么这就是您需要收听更改的原因

reaction(
  () => toJS(this.childrens),
  size => {
    // Expected { width: 0, height: 1000 }
    // Actual { width: 0, height: 0 }
    console.log("-----size=", toJS(this.size));
  }
);

通过收听

toJS（this.childrens）

，您可以订阅childrens的长度何时更改，以及childrens元素的属性何时更改

如果您只想在添加或删除新的子项时收听，那么收听

size

是有意义的。如果您想在添加、删除或修改孩子时收听，则需要更改您正在收听的内容

这是一个沙箱：

以及相关控制台日志：

-----size= Object {width: 0, height: 0}
-----size= Object {width: 0, height: 1000}

---

@KhusamovSukhrob是的我想你可能需要