首页 文章

从孩子到特定父母的反应导航

提问于
浏览 次
0

我正在开发项目，使用redux的react-navigation . 问题是当我在DrawerNav（Home）上并且转到PatientRecordNavigation - >菜单时，但是当按下后退按钮时，动作不会从PatientRecordNavigation（菜单）返回到 - > Home，而是返回到ChooseAnimal，我不知道我想转到ChooseAnimal，但需要去Home（就像在browserhistory上一样，总是回到上一个导航） . 后面的按钮位于 Headers 上，具有调度功能到减速器

const DrawerNav = DrawerNavigator({
    Home: {screen: Home},
    Records: { screen: PatientRecordNavigation }
},
{
  initialRouteName: "Home"
});

const PatientRecordNavigation = StackNavigator(
{
    ChooseAnimal: { screen: ChooseAnimal },
    Menu: { screen:Menu },
    Reminders: { screen: Reminders }   
},
{
    initialRouteName: "ChooseAnimal",
    headerMode: 'none'
});

导航减速机的一部分

case 'BACK':
        nextState = AppNavigator.router.getStateForAction(NavigationActions.back(), state);
    break;

请帮忙解决这个问题 . 谢谢

reactjs react-native react-redux react-navigation

3 回答

  • 0

    尝试将 key 添加到 NavigationActions.back() ，如here所述 . 您可以在导航状态下获取当前视图的键 . 如果这不起作用，请尝试传递 {key: null} .

    回复于
  • 0

    在减速机里面，有一个 Menu 的情况 . 配置后退按钮按下时按下 Menu 的操作 .

    case 'MENU':
    nextState = AppNavigator.router.getStateForAction(
            NavigationActions.navigate({ routeName: Screens.Menu})
        );
break;

    后退按钮配置

    import { BackHandler } from 'react-native'
 ...
 ...

 componentWillMount() {
    this.backButtonListener = BackHandler.addEventListener('hardwareBackPress', () => {
        this.context.props.navigation.dispatch({ type: 'MENU' });
        return true;
    }); 
}

 componentWillUnmount() {
    this.backButtonListener.remove();
}

    希望这可以帮助

    回复于
  • 0

    我通过在reducer上添加类型来解决这个任意路径 . 当我来自Home - > Menu时，当我来自ChooseAnimal时，我会调用RECORD_HOME - >菜单，我称之为RECORD

    因此，解决方案是使用导航重置，当我不回到ChooseAnimal时，我将更改（使用重置功能）initialRouteName

    示例代码：

    const initialState = AppNavigator.router.getStateForAction(
   NavigationActions.init()
);
const navReducer = (state = initialState, action) => {
     let nextState;
     switch(action.type){
        case 'RECORD_HOME':
          nextState = changeInitialRoute('Menu', state, {animal: action.payload, parentKey: state.key})
        break;
        case 'RECORD':
          nextState = defineRoute('Menu', state, {animal: action.payload, parentKey: state.key})
        break;
        default:
          nextState = AppNavigator.router.getStateForAction(action, state)
        break;
     }
    return nextState || state;
}

const changeInitialRoute = (routeName, state, params = null) =>{
   let action = NavigationActions.reset({
      index:0,
      actions:[NavigationActions.navigate({routeName: routeName, params: params})]
    })
   return(
    AppNavigator.router.getStateForAction(action, state)
   );
 }

 const defineRoute = (routeName, state, params = null) =>{
  let action = NavigationActions.navigate({ 
    routeName: routeName,
    params: params
  });
  return(
    AppNavigator.router.getStateForAction(action, state)
  );
}
    回复于

相关问题