在action creator里无法转换屏幕 React Navigation 5

#1

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);
    ```

userActions.js
```
import {LOGIN_WITH_FACEBOOK} from ‘./types’;

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

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;
```
#2

AuthStack.Navigator外头套一个<Context.Provider>

1 Like
#3

@milk_tea_imouto 已经有Connect mapStateToProps, 不知道为什么没自动渲染。 https://reactnavigation.org/docs/auth-flow/

#4

这是我的实现方法。

image

image

登录页面组件

image

1 Like
#5

这个项目不允许用Hooks, 需要用Redux.

找到原因了，combineReducer那边是 user: userReducer , 要 state.user才能连接到。

     const mapStateToProps = (state) => {
            return {isAuthenticated: state.user.isAuthenticated};
        };
        export default connect(mapStateToProps, null)(AuthStackNav);


 const rootReducer = combineReducers({
    user: userReducer
 })
 export default rootReducer