使用 React-Navigtion 和 Redux 返回(重置)到初始状态的正确方法是什么。
这是我的初始状态:
const firstAction = AppNavigator.router.getActionForPathAndParams('HomeDrawer');
const tempNavState = AppNavigator.router.getStateForAction(firstAction);
const secondAction = AppNavigator.router.getActionForPathAndParams('Login');
const INITIAL_STATE = AppNavigator.router.getStateForAction( secondAction, tempNavState );
这是我的 reducer :
export default (state = INITIAL_STATE, action) => {
let nextState;
switch (action.type) {
case 'LOGIN':
nextState = AppNavigator.router.getStateForAction(NavigationActions.back()), state);
break;
case 'LOGOUT_TEMP':
nextState = AppNavigator.router.getStateForAction(NavigationActions.navigate({ routeName: 'Login' }), state);
break;
case 'LOGOUT_START':
// Don't know exactly what to do here
nextState = { ...INITIAL_STATE };
break;
default:
nextState = AppNavigator.router.getStateForAction(action, state);
break;
}
return nextState || { ...state };
};
我不确定这是否可行。我不明白 React-Navigation 如何在幕后处理这个问题。它会监听这种类型的状态变化并适当导航,还是我需要始终通过 getStateForAction(NavigationActions.something(...), state) 运行操作?
nextState = { ...INITIAL_STATE };
我以前在不使用 Redux 的时候就这样做过:
const resetLogin = NavigationActions.reset({
index: 1,
actions: [
NavigationActions.navigate({ routeName: "HomeDrawer" }),
NavigationActions.navigate({ routeName: "Login" })
]
});
我是否对上面的内容执行以下操作?
nextState = AppNavigator.router.getStateForAction(resetLogin, state);
如何将 React-Navigation 重置回 Redux 初始状态,我能否使用上面的 const INITIAL_STATE 以某种方式执行此操作?
谢谢,
沃伦·贝尔
最佳答案
哇,没有答案。作为记录,我最终使用了:
const resetLogin = NavigationActions.reset({
index: 1,
actions: [
NavigationActions.navigate({ routeName: "HomeDrawer" }),
NavigationActions.navigate({ routeName: "Login" })
]
});
然后在我的 reducer 中这样做:
nextState = AppNavigator.router.getStateForAction(resetLogin, state)
我还发现使用:
AppNavigator.router.getActionForPathAndParams('ScreenName');
如果“ScreenName”是 DrawerNavigator 中的屏幕,则不会为我提供正确的 redux 操作。使用以下内容让我获得正确的 redux 操作:
NavigationActions.navigate({ routeName: 'ScreenName' })
希望这对其他人有帮助。
谢谢,
沃伦·贝尔
关于react-native - React Navigation 使用 Redux 重置堆栈的正确方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49261870/