Question

我遇到react-native-router-flux的问题，我想在更改标签时重置我的堆栈导航。我使用backToinitial但我需要点击两次才能重置我的导航有人知道为什么？

export default class App extends Component {
    render() {
        return (
            <Router>
                <Tabs
                  key="root"
                  tabBarStyle={{ backgroundColor: '#FFFFFF' }}
                  backToInitial={true}
                >
              <Scene key="osu" title="OSU" icon={TabIcon}>

                <Scene 
                  key="scarlet"
                  component={ScarletScreen}
                  title="Scarlet"
                />
                <Scene
                  key="gray"
                  component={GrayScreen}
                  title="Gray"
                />
              </Scene>

              <Scene key="vu" title="VU" icon={TabIcon}>

                <Scene 
                  key="blue"
                  component={BlueScreen}
                  title="Blue"
                />
                <Scene
                  key="black"
                  component={BlackScreen}
                  title="Black"
                />

              </Scene>
            </Tabs>
        </Router>
      );
}

}

Answer 1

如果有其他人遇到，我会进行公关修复。

https://github.com/aksonov/react-native-router-flux/pull/3131/

如果您不想等待修复，则可以通过添加以下道具来向选项卡添加替代：

 <Tabs 
   tabBarOnPress={({ scene, jumpToIndex }) => {
      const { route, focused } = scene;
      const { key } = route;
      if(focused) return;
      if (key === 'homeTab' && route.routes.length > 1) {
         Actions['firstSceneUnderHomeTab']({ type: ActionConst.replace });
      } else {
        //normally navigate to a tab
        jumpToIndex(scene.index);
      }
   }}>

但是请确保没有在任何选项卡上设置backToInitial，因为最新版本存在一个bug，其中backToInitial覆盖了tabBarOnPress。希望很快会更新。

react-native-router-flux reset StackNavigation

1 个答案: