微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Mobx 如何计算状态中的值

如何解决Mobx 如何计算状态中的值

我是 Mobx 的新手,不知道如何计算商店中的值。

我正在关注docs description of using the 'computed' modifier

这是我的(缩减的)appState:

export default class AppState {
    constructor() {
        /* MOBX STATE */
        extendobservable(this,{
            // Links
            'links': [],'updateLinks': action((newlinks) => {
                this.links = newlinks;
            }),'linksWithComments': computed(() => this.links),});
    }
}

'links' 在我的 React 组件中工作正常,但是当我添加 'linksWithComments' 时,我看到了这个错误

Uncaught Error: [MobX] 'keys()' can only be used on observable objects,arrays,sets and maps

我做错了什么? 'links' 是一个数组,据我所知它是可观察的,那么错误是什么意思?我在谷歌上搜索错误消息,但没有找到任何可以解释发生了什么的信息。

我也试过这种形式:

get linksWithComments () { return 2*3; },

在这种情况下,'linksWithComments' 未定义。

版本:

"mobx": "^6.1.8","mobx-react": "^7.1.0","mobx-react-lite": "^3.2.0",

谢谢!

解决方法

在类中使用 MobX@6 的首选方法是使用 makeAutoObservablemakeObservable

class AppState {
  links = [];

  constructor() {
    makeAutoObservable(this);
  }

  updateLinks = (newLinks) => {
    this.links = newLinks;
  };

  get linksWithComments() {
    return this.links.filter((link) => link > 0.5);
  }
}

你试过了吗?

我已经制作了 Codesanbox example 供您探索!

More info in the official docs

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。