Question

我有一家Mobx商店，我正在提供商内部传递此商店，当我安慰 this.props 时，它显示了Mobx商店的结构。

下面是我的Mobx商店

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

// useStrict(true);

class OpenPropertiesStore {

  @observable openProperties = {};

  @action
  fetchOpenProperties() {
    fetch(`http://uinames.com/api/`)
      .then(res => res.json())
      .then(data => {
        runInAction(() => {
          this.openProperties = data;
          this.name = "abhinav";
        })
      })
  }

  @computed get getOpenProperties() {
    return this.openProperties;
  }

}

export default new OpenPropertiesStore();

内部组件我正在调用ComponentDidMount 如果我在打印“ this.props”，则显示商店。但是我不能调用这样的函数

@inject('UserStore', 'CityStore', 'OpenPropertiesStore')
@observer
export default class Navigation extends Component {
   componentDidMount = async () => {
      const { CityStore, UserStore, OpenPropertiesStore } = this.props;
      const data = OpenPropertiesStore.getOpenProperties();
   }
}

给我错误

YellowBox.js：67可能的未处理的承诺拒绝（id：0）： TypeError：OpenPropertiesStore.getOpenProperties不是一个函数 TypeError：OpenPropertiesStore.getOpenProperties不是函数

任何人都知道如何解决此错误

Answer 1

MobX不应作为函数调用，而应像属性一样访问它们。

const data = OpenPropertiesStore.getOpenProperties;

此外，如果您只想从存储中返回一个属性-无需为其编写单独的@computed，因为您无需在其中进行任何计算。只需直接访问

const data = OpenPropertiesStore.openProperties;

Mobx在另一个Observer组件中存储函数调用

1 个答案: