如何使用 wix react-native-navigation 获得 bottomTab 按下动作？

Question

我在 react-native-navigation 中设置了带有底部选项卡的导航，效果很好

bottomTabs: {
  id: 'BOTTOM_TABS_LAYOUT',
  children: [
    {
      stack: {
        id: 'HOME_TAB',
        children: [
          {
            component: {
              id: 'HOME_SCREEN'
              name: 'HomeScreen'
            }
          }
        ],
        options: {
          bottomTab: {
            icon: require('./home.png')
          }
        }
      }
    },
    {
      stack: {
        id: 'PROFILE_TAB',
        children: [
          {
            component: {
              id: 'PROFILE_SCREEN',
              name: 'ProfileScreen'
            }
          }
        ],
        options: {
          bottomTab: {
            icon: require('./profile.png')
          }
        }
      }
    }
  ]
}

但是当我从一个选项卡切换到另一个选项卡时，我想添加一些其他代码，这怎么办？

Answer 1

您可以通过注册导航事件侦听器来侦听选项卡选择事件。 tabSelected 事件在所选选项卡发生更改时发出。

Navigation.events().registerBottomTabSelectedListener((selectedTabIndex, unselectedTabIndex) => {
});

如果您想自己处理选项卡选择，请在您想要为其处理选择的 bottomTab 上设置 selectTabOnPress: false 选项，并注册一个 tabPressed 侦听器处理标签按下事件。当用户按下选项卡时会发出此事件。

options: {
  bottomTab: {
    icon: require('./home.png'),
    selectTabOnPress: false
  }
}

Navigation.events().registerBottomPressedListener((tabIndex) => {
});