Реакция навигации Не удалось найти «store» в контексте «Connect (AuthScreen)»

Question

Я пытаюсь войти на Facebook с моим приложением expo response.Но у меня есть проблема.Я использовал редукс.Мой app.js здесь.

import { createBottomTabNavigator,  createAppContainer, createStackNavigator 

} from 'react-navigation';

import AuthScreen from './screens/AuthScreen';
import { Provider } from  'react-redux'
import store from './store';

const MainNavigator = createBottomTabNavigator({
  welcome: {screen: WelcomeScreen},
  auth: { screen: AuthScreen },
  main: {
    screen: createBottomTabNavigator({
      map: { screen: MapScreen },
      deck: { screen: DeckScreen },
      review: {
        screen: createStackNavigator({
          review: { screen: ReviewScreen },
          settings: { screen: SettingsScreen }
        })
      }
    })
  }
})

class App extends React.Component {
  render() {
    return (
      <Provider store={store} >
        <View>
          <MainNavigator/>
        </View>
      </Provider>
    );
  }
}


export default createAppContainer(MainNavigator)

А это мой AuthScreen.js

import React, { Component } from 'react';
import { View, Text } from 'react-native';
import { connect } from 'react-redux';
import * as actions from '../actions/auth_actions';

class AuthScreen extends Component {
    componentDidMoun(){
        this.props.facebookLogin();
    }
    render(){
        return(
            <View>
                <Text>Auth</Text>
            </View>
        )
    }
}

export default connect(null, actions)(AuthScreen);

Я позвонил facebookLogin () функция внутри моего auth_action.js файл

export const facebookLogin = () => async dispatch => {

let token = await AsyncStorage.getItem('fb_token');
  if(token) {
    dispatch({ type: FACEBOOK_LOGIN_SUCCESS, payload: token })
  }else{
      doFacebookLogin(dispatch);
  }
}

редуктор / index.js файл

import { combineReducers } from 'redux';

export default combineReducers({
    auth: () => { return {} }
});

И этомой store.js файл.

import { createStore, compose, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import reducers from '../reducers';

const store = createStore(
    reducers,
    {},
    compose(
        applyMiddleware(thunk)
    )
);

export default store;

Но я получаю эту ошибку.

Инвариантное нарушение: не удалось найти «хранилище» в контексте«Подключиться (AuthScreen)».Либо оберните корневой компонент в a, либо передайте пользовательский поставщик контекста React соответствующему получателю контекста React в Connect (AuthScreen) в параметрах соединения.

В чем проблема?Вы можете мне помочь?

Answer 1

import React, { Component } from "react";
import { connect } from "react-redux";
import * as actions from "../actions";
import {
  createBottomTabNavigator,
  createAppContainer,
  createStackNavigator
} from "react-navigation";

import AuthScreen from "../screens/AuthScreen";
import HomeScreen from "../screens/HomeScreen";
import SettingsScreen from "../screens/SettingsScreen";
import DeckScreen from "../screens/DeckScreen";
import MapScreen from "../screens/MapScreen";
import ReviewScreen from "../screens/ReviewScreen";

const AppNavigator = createBottomTabNavigator({
  home: { screen: HomeScreen },
  auth: { screen: AuthScreen },
  main: {
    screen: createBottomTabNavigator({
      map: { screen: MapScreen },
      deck: { screen: DeckScreen },
      review: {
        screen: createStackNavigator({
          review: { screen: ReviewScreen },
          settings: { screen: SettingsScreen }
        })
      }
    })
  }
});

const AppContainer = createAppContainer(AppNavigator);

    enter code here

class AppNavigation extends Component {
  render() {
    return <AppContainer screenProps={this.props} />;
  }
}

export default connect(
  null,
  actions
)(AppNavigation);

import React, { Component } from "react";
import { Provider } from "react-redux";
import AppNavigation from "./navigation/AppNavigation";
import store from "./store";
class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <AppNavigation />
      </Provider>
    );
  }
}
export default App;

Answer 2

Вы не подключили свой магазин к этому компоненту export default connect(null, actions)(AuthScreen);, и вы передали null, где вы должны передать некоторые mapper и просто action, где вы должны определить, какие функции вы хотите импортировать из редуктора.