react-native - 在选项卡更改时 react 导航

Question

在不使用 Redux 的情况下，如何使用 React 导航选项卡导航器检测选项卡更改？

我知道我需要以某种方式使用 onNavigationStateChange 但我不知道如何更新当前 View 。

export default () => <MyTabNav
    ref={(ref) => { this.nav = ref; }}
    onNavigationStateChange={(prevState, currentState) => {
        //call function on current view
    }}
/>;

Answer 1

export default () => <MyTabNav
    ref={(ref) => { this.nav = ref; }}
    onNavigationStateChange={(prevState, currentState) => {
       const getCurrentRouteName = (navigationState) => {
         if (!navigationState) return null;
         const route = navigationState.routes[navigationState.index];
         if (route.routes) return getCurrentRouteName(route);
         return route.routeName;
       };
    global.currentRoute = getCurrentRouteName(currentState);
  }}
/>;

如果您不想使用 redux，这就是您可以存储有关当前路由的全局信息的方式，这样您既可以检测选项卡更改，也可以判断哪个选项卡现在处于事件状态。