在redux action creator里如何转换屏幕 React Navigation 5

userActions.js

import {LOGIN_WITH_FACEBOOK} from './types';

export const loginWithFacebook = () => (dispatch) => {        
    dispatch({ type: LOGIN_WITH_FACEBOOK, payload: {isAuthenticated: true} });                                              
};

AuthStackNav.js

const AuthStackNav = ({isAuthenticated}) => {
    const AuthStack = createStackNavigator();

    return (        
        <AuthStack.Navigator initialRouteName='Auth'>
        {
            isAuthenticated ?
            <AuthStack.Screen name='Home' component={HomeScreen} />                
            :
            <AuthStack.Screen  name='Auth' component={AuthScreen} />      
        }                       
                         
        </AuthStack.Navigator>
        
    );
};
const mapStateToProps = ({isAuthenticated}) => {
    return {isAuthenticated};
};
export default connect(mapStateToProps, null)(AuthStackNav);

userReducer.js

import {LOGIN_WITH_FACEBOOK} from '../actions/types.js';

const initialState = {
    isAuthenticated: false    
};

const userReducer = (state=initialState, action) => {
    switch(action.type){
        case LOGIN_WITH_FACEBOOK: 
            return {...state, ...action.payload};
        default: 
            return state;
    }
}
export default userReducer;

rootReducer.js

import {combineReducers} from 'redux';
import userReducer from './userReducer';


const rootReducer = combineReducers({
    user: userReducer
 })
 export default rootReducer
 
已解决 悬赏分:20 - 解决时间 2022-01-05 02:37
反对 0举报 0 收藏 0

回答1

最佳
  • @

    我按照这个档案解决的 https://reactnavigation.org/d...

    RootNavigation.js

    import * as React from 'react';
    
    export const navigationRef = React.createRef();
    
    export function navigate(name, params) {
      navigationRef.current?.navigate(name, params);
    }

    AppNav.js

    import { navigationRef } from './RootNavigation.js';
    const AppNav = () => {
        return (
            <NavigationContainer ref={navigationRef} >
                <AuthStackNav />
            </NavigationContainer>
        );
    };
    
    export default AppNav;

    userActions.js

    export const loginWithFacebook = () => (dispatch) => {        
        dispatch({ type: LOGIN_WITH_FACEBOOK, payload: {isAuthenticated: true} });   
        RootNavigation.navigate('Home');                                    
    };
    支持 0 反对 0 举报
    2022-01-04 09:39