Redux State改变后Navigator怎么没自动渲染screen React Navigation 5
AppNav.js
import React, {useState, useEffect} from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import { connect } from 'react-redux';
import AuthScreen from '../screens/AuthScreen';
import HomeScreen from '../screens/HomeScreen';
const Stack = createStackNavigator();
const AppNav = ({isAuthenticated}) => {
const [logged, setLogged] = useState(false)
useEffect(() => {
if(isAuthenticated) {
console.log(logged);
setLogged(true);
} else {
setLogged(false);
console.log(logged);
}
},[isAuthenticated])
return (
<NavigationContainer>
<Stack.Navigator>
{
!logged?
<Stack.Screen name='Auth' component={AuthScreen} options={{headerShown: false}} />
:<Stack.Screen name='Home' component={HomeScreen} options={{headerShown: false}} />
}
</Stack.Navigator>
</NavigationContainer>
);
}
const mapStateToProps = ({isAuthenticated}) => {
return {
isAuthenticated
};
}
export default connect(mapStateToProps, null)(AppNav)
userAction.js
import {LOGIN_WITH_FACEBOOK} from './types';
export const loginWithFacebook = () => async(dispatch) => {
dispatch( { type: LOGIN_WITH_FACEBOOK, payload: {isAuthenticated: true} } );
}
userReducer.js
import {LOGIN_WITH_FACEBOOK} from '../actions/types.js';
const INITIAL_STATE = {
isAuthenticated: false
};
const userReducer = (state=INITIAL_STATE, 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
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
找到原因了,combineReducer那边是
user: userReducer
, 要state.user
才能连接到。AppNav.js