javascript - 为什么不跟踪 js 类的 mobx 可观察属性，但跟踪 mobx 可观察对象的属性？

Question

我是 mobx 的新手，我想对 Mobx 进行快速测试，看看我如何才能将它应用到我的项目中。

当我运行这段代码时

class Entity{
   @observable version = 1;
}

let testEntity = new Entity();

let disposer = autorun(() => console.log(`Entity version : ${testEntity.version}`));

testEntity.version = 2;
testEntity.version = 3;

disposer();

我希望看到这个输出

Entity version : 1
Entity version : 2
Entity version : 3

但是，相反，我只看到实体版本:1

但是，如果我使用可观察的普通对象而不是具有可观察属性的类，我将获得所需的输出。示例:

let testEntity = observable({ version: 1 });

let disposer = autorun(() => console.log(`Entity version : ${testEntity.version}`));

testEntity.version = 2;
testEntity.version = 3;

disposer();
// this works and I see autorun firing three times instead of only the first.

所以我认为我应该使类实例可观察。

我使用了 let testEntity = observable(new Entity()); 但这引发了关于某些 .box 函数的错误。

我再次尝试，这次使用 let testEntity =observable.box(new Entity()); 并且我没有错误。

但是这次我得到了这个结果 Entity version: undefined

这是怎么回事，我怎样才能实现可观察的类实例？

也许我采用了错误的方法来解决我的问题。我想让我的领域对象作为类实例来添加一些业务逻辑，并在其中进行数据操作。

我已经阅读了关于 mobx 跟踪和不跟踪的文章，但似乎我仍然遗漏了一些东西。

Answer 1

我没有经常使用 autorun，但我认为问题是你在类之外调用 autorun。尝试将该行代码移动到您的类中:

class Entity{
   @observable version = 1;

   let disposer = autorun(() => console.log(`Entity version : ${version}`));
}

let testEntity = new Entity();



testEntity.version = 2;
testEntity.version = 3;

testEntity.disposer();