React-Native + Mobx + React Navigation：错误：MobX 注入器：存储“...”不可用！确保它是由某个 Provider 提供的答案

【问题标题】：React-Native + Mobx + React Navigation : Error: MobX injector: Store '...' is not available! Make sure it is provided by some ProviderReact-Native + Mobx + React Navigation：错误：MobX 注入器：存储“...”不可用！确保它是由某个 Provider 提供的
【发布时间】：2018-09-26 09:57:14
【问题描述】：

我无法从我的代码中解决这个问题。当我切换到电影细节视图时，我收到了这个错误：错误：MobX 注射器：商店'...'不可用！确保它是由某个 Provider 提供的

这里是我的 app.js APP.JS

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

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

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

    render() {
        return (
            <View>
                <Text>{FilmStore.test}</Text>
                <Navigation filmStore={FilmStore} />
            </View>
        );
    }
}

这里是来自 React Navigation 的导航导航.JS

import { createStackNavigator } from 'react-navigation';

// Views
import Search from '../Components/Search'
import FilmDetail from "../Components/FilmDetail";

const SearchStackNavigator = createStackNavigator({
    Search: {
        screen: Search,
        navigationOptions: {
            title: 'Rechercher'
        }
    },
    FilmDetail: {
        screen: FilmDetail,
        navigationOptions: {
            title: 'Détail'
        }
    },
});

export default SearchStackNavigator;

这里是电影详细视图 FilmDetail.JS

import React from 'react'
import Moment from 'moment';
import { observer, inject } from 'mobx-react';

import {StyleSheet, View, Text, ActivityIndicator, ScrollView, Image, Button} from 'react-native'
import {getDetail, getImageURI} from "../API/TMDBApi";

@inject('filmStore')

@observer
class FilmDetail extends React.Component {

    constructor(props){
        super(props);
        console.log(props);
    }

    render() {
        return (
            <View>
            </View>
        )
    }
}

export default FilmDetail

寻求帮助:) 谢谢！

【问题讨论】：

尝试导入观察者并从mobx-react/native注入
与 mobx-react/native 相同的错误

标签： reactjs react-native react-navigation mobx

【解决方案1】：

我在 app.js 中替换了

..
import { observer } from 'mobx-react';
..

render() {
    return (
        <View>
            <Text>{FilmStore.test}</Text>
            <Navigation filmStore={FilmStore} />
        </View>
    );
}

通过

..
import { observer, Provider } from 'mobx-react';
..

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

现在它可以完美运行了。

【讨论】：