尝试在 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

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

export default FilmStore;

至

export default new FilmStore();

尝试在 React-Native 中使用 MOBX

Trying to use MOBX in React-Native

reactjs

react-native

mobx