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为空。我如何在本机上使用mobx可能是错误的？寻找帮助...

谢谢！

Answer 1

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

export default FilmStore;

到

export default new FilmStore();

尝试在React-Native中使用MOBX

1 个答案: