MobX和深层可观察性

时间:2018-08-24 20:20:19

标签: javascript mobx

我试图了解MobX中的深层可观察性。 特别是,在下面的代码中,我希望每次运行setCommentCountForPost时都会调用自动运行,但是目前没有。

我应该如何解决此代码?而且,当我阅读其中包含帖子的列表时,在Post属性上可观察到的足以激活自动运行功能吗? (就像我在自动运行中一样)

我正在使用MobX 5。

编辑:如果在自动运行中使用以下调用,我发现代码工作正常:console.log(toJS(p.getPosts()));。 这很有趣,但是为什么?如果只想调用getPosts()怎么办?

这是代码

import { useStrict, configure, autorun } from 'mobx';
import { toJS, observable, action, computed } from 'mobx';


configure({ enforceActions: true });

class Post {
    @observable commentCount = 0;

    setCommentCount(c) {
        this.commentCount = c;
    }
}

class PostList {
    @observable _posts = {};

    @action createPost(id) {
        this._posts[id] = new Post();
    }

    @action setCommentCountForPost(id, c) {
        this._posts[id].setCommentCount(c);
    }

    getPosts() {
        return this._posts;
    }
}

let p = new PostList();
p.createPost(1);


autorun(function test () {
    console.log(p.getPosts());
});


p.setCommentCountForPost(1, 22);

1 个答案:

答案 0 :(得分:1)

MobX跟踪属性访问,而不是值

在您的示例中,自动运行功能仅跟踪_posts,但不跟踪_posts的属性,因此,如果更改_posts值,则跟踪功能将起作用

console.log(toJS(p.getPosts()))的工作原因是toJS函数,以便将可观察的值转换为正常值,它访问_posts的属性。

如果希望p.getPosts()有效,则应迭代访问_posts的属性。