为什么我无法在React Native中使用Mobx从Store获取状态？

Question

现在，我在下面的代码中尝试在Mobx Store中设置状态。 但是，我不知道为什么该状态为“未定义”。

幸运的是，我从未通过此问题得到任何错误。

这是一个组件。

import React from 'react';
import {StyleSheet,View} from 'react-native';
import { Provider, observer } from 'mobx-react';
import RestaurantStore from '../Stores/RestaurantStore';
import GeneralScreenComponent 
        from'../Components/GeneralScreenComponent';

@observer
class Restaurant extends React.Component {
  render() {
   console.log(RestaurantStore.headerTitle);
  return (
   <View style={styles.container}>
     <Provider store={RestaurantStore}>
       <GeneralScreenComponent
         headerTitle={RestaurantStore.headerTitle} />
     </Provider>
   </View>
  );
 }
}

这是商店。

import { observable } from 'mobx';

class RestaurantStore {
 @observable headerTitle = '飲食';
}


export default RestaurantStore;

Answer 1

您似乎尚未实例化RestaurantStore商店。 通过如下修改export行来更新RestaurantStore模块：

import { observable } from 'mobx';

class RestaurantStore {
 @observable headerTitle = '飲食';
}

// Ensures that the RestaurantStore is instantiated whenever it's used in your application
export default new RestaurantStore();

Answer 2

我解决了这个问题。

我刚换

export default RestaurantStore;

至

export default new RestaurantStore();