React native 反应导航在反应本机操作中不起作用

React native 反应导航在反应本机操作中不起作用,react-native,react-redux,react-native-android,react-navigation,React Native,React Redux,React Native Android,React Navigation,请检查下面的代码,登录成功后我必须导航到EmployeeCreate。我在dispatch(NavigationActions.navigate({routeName:'EmployeeCreate'})中使用它在my AuthActions.js中。但不起作用。以前我用“react native router flux”代替react导航。我是新手,无法找到问题所在 App.js import React, { Component } from 'react'; import { Provid

请检查下面的代码,登录成功后我必须导航到EmployeeCreate。我在
dispatch(NavigationActions.navigate({routeName:'EmployeeCreate'})中使用它在my AuthActions.js中。但不起作用。以前我用“react native router flux”代替react导航。我是新手,无法找到问题所在

App.js

import React, { Component } from 'react';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import firebase from 'firebase';
import ReduxThunk from 'redux-thunk';
import reducers from './reducers';
import Router from './Router';

class App extends Component {
 componentWillMount() {
const config = {
apiKey: "###",
authDomain: "###",
databaseURL: "###",
projectId: "###",
storageBucket: "###,
messagingSenderId: "0000000"
};

firebase.initializeApp(config);
}

 render() {
   const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));

return (
  <Provider store={store}>
    <Router />
  </Provider>
);
}
}

export default App;
authoctions.js

import firebase from 'firebase';
    import { NavigationActions } from 'react-navigation'
    import {
      EMAIL_CHANGED,
      PASSWORD_CHANGED,
      LOGIN_USER_SUCCESS,
      LOGIN_USER_FAIL,
      LOGIN_USER
    } from './types';

    export const emailChanged = (text) => {
      return {
        type: EMAIL_CHANGED,
        payload: text
      };
    };

    export const passwordChanged = (text) => {
      return {
        type: PASSWORD_CHANGED,
        payload: text
      };
    };

    export const loginUser = ({ email, password }) => {
      return (dispatch) => {
        dispatch({ type: LOGIN_USER });

        firebase.auth().signInWithEmailAndPassword(email, password)
          .then(user => loginUserSuccess(dispatch, user))
          .catch((error) => {
            console.log(error);

            firebase.auth().createUserWithEmailAndPassword(email, password)
              .then(user => loginUserSuccess(dispatch, user))
              .catch(() => loginUserFail(dispatch));
          });
      };
    };

    const loginUserFail = (dispatch) => {
      dispatch({ type: LOGIN_USER_FAIL });
    };

    const loginUserSuccess = (dispatch, user) => {
      dispatch({
        type: LOGIN_USER_SUCCESS,
        payload: user
      });
    dispatch(NavigationActions.navigate({ routeName: 'EmployeeCreate' }));
    };
AuthReducer.js

import {
    EMAIL_CHANGED,
    PASSWORD_CHANGED,
    LOGIN_USER_SUCCESS,
    LOGIN_USER_FAIL,
    LOGIN_USER
  } from '../actions/types';

  const INITIAL_STATE = {
    email: '',
    password: '',
    user: null,
    error: '',
    loading: false
  };

  export default (state = INITIAL_STATE, action) => {
    switch (action.type) {
      case EMAIL_CHANGED:
        return { ...state, email: action.payload };
      case PASSWORD_CHANGED:
        return { ...state, password: action.payload };
      case LOGIN_USER:
        return { ...state, loading: true, error: '' };
      case LOGIN_USER_SUCCESS:
        return { ...state, ...INITIAL_STATE, user: action.payload };
      case LOGIN_USER_FAIL:
        return { ...state, error: 'Authentication Failed.', password: '', loading: false };
      default:
        return state;
    }
  };

您正在使用Redux的
dispatch
方法。您应该改用React导航的
dispatch
方法。您可以执行以下操作之一:

1) 执行
this.props.navigation.dispatch(NavigationActions.navigate({routeName:'EmployeeCreate'}))


2) 或者将
React导航
Redux
集成(特别推荐用于您的情况),并使用Redux的默认
调度
。我为React导航创建了一个裸体回购,React导航的Redux流在更新版本的React导航中有一点变化

您可以从他们的文档本身的
3.x
中找到最佳方法


谢谢!!第一个选项对我不起作用。我试试第二个
import {
    EMAIL_CHANGED,
    PASSWORD_CHANGED,
    LOGIN_USER_SUCCESS,
    LOGIN_USER_FAIL,
    LOGIN_USER
  } from '../actions/types';

  const INITIAL_STATE = {
    email: '',
    password: '',
    user: null,
    error: '',
    loading: false
  };

  export default (state = INITIAL_STATE, action) => {
    switch (action.type) {
      case EMAIL_CHANGED:
        return { ...state, email: action.payload };
      case PASSWORD_CHANGED:
        return { ...state, password: action.payload };
      case LOGIN_USER:
        return { ...state, loading: true, error: '' };
      case LOGIN_USER_SUCCESS:
        return { ...state, ...INITIAL_STATE, user: action.payload };
      case LOGIN_USER_FAIL:
        return { ...state, error: 'Authentication Failed.', password: '', loading: false };
      default:
        return state;
    }
  };