尝试在 React-Native 中使用 MOBX

Question

我已经阅读了很多关于在 React 中使用 mobx 的教程。 我正在尝试在 React Native 中使用存储逻辑来实现它，但我的结果不好，我无法从存储中检索我的全局状态。

这里是我的 app.js

import React from 'react';
import {StyleSheet, View} from "react-native";

// import Search from './Components/Search';
import Navigation from './Navigation/Navigation';
import FilmStore from './Stores/FilmStore';


import { observer } from 'mobx-react';

@observer
export default class App extends React.Component {
    constructor(props){
        super(props);

        // Empty 
        console.log(props.FilmStore);
       // empty
        console.log(FilmStore.test);
    }

  render() {
    return (
        <View style={styles.mainContainer}>
         <Navigation />
        </View>
    );
  }
}

const styles = StyleSheet.create({
    mainContainer: { flex: 1 },
});

这里是我的 mobx 商店

import { observable, computed, configure } from 'mobx';

// Strict mode
configure({
    enforceActions: 'always'
});

// Déclaration de notre store
class FilmStore {
    @observable test = 'aa';

    @computed setTest($text){
        this.test = $text;
    }
}

export default FilmStore;

如您所见，props.FilmStore 是空的。我如何在 react native 上使用 mobx 可能是错误的？ 寻求帮助...

谢谢！

Answer 1

您没有实例化您的商店，我怀疑您在将其作为道具传递时也没有实例化。您可以在商店中进行一项更改并使用单例模式返回它的单个实例，更改

export default FilmStore;

到

export default new FilmStore();