如何在反应导航中传递动作类型redux?

时间:2017-05-27 07:44:36

标签: react-native react-redux react-native-android react-navigation

如果在使用redux的反应导航中成功登录时如何传递操作类型?

这里是我的代码......

import { Login } from '../constant/Constant'

import { NavigationActions } from "react-navigation";
import dispatch from "redux/es/createStore";

export function login(data) {
    if (data.email === 'me') {
        //NavigationActions.navigate({ routeName: 'Route' });
        console.log("login success");
        return (dispatch) => {
            dispatch({type: 'Login'});
        };
    }else{
        console.log("login error");
    }
}

这是我的reducer.js,以及如何将操作登录传递到此处,我在登录成功时尝试自己,但无法将操作类型登录传递到此处

import { combineReducers } from 'redux';
import { NavigationActions } from 'react-navigation';
import { AppNavigator } from '../navigators/AppNavigator';
import { reducer as formReducer } from 'redux-form'
const firstAction       = AppNavigator.router.getActionForPathAndParams('Main');
const tempNavState      = AppNavigator.router.getStateForAction(firstAction);
const secondAction      =     AppNavigator.router.getActionForPathAndParams('Login');
const initialNavState   = AppNavigator.router.getStateForAction(
    secondAction,
    tempNavState
)

function nav(state = initialNavState, action) {
    let nextState;
    switch (action.type){
        case 'Login':
            nextState = AppNavigator.router.getStateForAction(
                NavigationActions.back(),
                state
            );
            break;
        case 'Logout':
            nextState = AppNavigator.router.getStateForAction(
                NavigationActions.navigate({routeName: 'Login'}),
                state
            );
            break;
        default:
            nextState = AppNavigator.router.getStateForAction(action, state);
            break;

    }

    return nextState || state;
}

const initialAuthState  = { isLoggedIn: false };

//如何将action.js的登录传递到此处

function auth(state = initialAuthState, action) {
    switch (action.type){
        case 'Login':
            console.log(action.type);
            return { ...state, isLoggedIn:true };
        case 'Logout':
            return { ...state, isLoggedIn:false};
        default:
            return state;
    }
}

const AppReducer = combineReducers({
    nav,
    auth,
    form: formReducer
})

export default AppReducer;

1 个答案:

答案 0 :(得分:0)

可以粘贴redux/es/createStore,希望了解dispatch方法的导出方式

你可以做的是:

export function login(data) {
    if (data.email === 'me') {
        dispatch({type: 'Login'});
    }else{
        console.log("login error");
    }
}

查看http://redux.js.org/docs/basics/Store.html,我的代码中没有store

将reducer与商店结合后,你可以做类似的事情

import { createStore } from 'redux'

let store = createStore(reducers); //connecting reducers to store

.
..
...

export dispatch = (action) => store.dispatch(action);