Question

我有

screen: createBottomTabNavigator(
        {
          firstTab: {
            screen: createStackNavigator({
              firstStack: {
                screen: firstStackScreen
              },
              SecondStack: {
                screen: SecondStackScreen
                }
              }
            }),
          secondTab: {
            screen: SecondTabScreen,
          }

在firstTabScreen内，我想访问tabBarOnPress函数。我可以访问secondTab屏幕内的tabBarOnpress函数没有问题，但不能在firstStackScreen内部。有没有办法做到这一点？

class firstStackScreen extends Component {
  static navigationOptions = ({ navigation }) => {
    return {
      tabBarOnPress({ navigation, defaultHandler }) {
        ....
      }
    };
  };
}

我知道我可以在我的应用程序屏幕中访问它，我在其中定义了这些选项卡和堆栈，但是为了使我的代码正常工作，我需要在firstStackScreen.js文件中进行此操作。

Answer 1

据我了解，您想访问嵌套stackNavigation中父级的navigationOptions，如documentation v3.x中所述，它们将不起作用

相反，他们在类似的示例中提到了如何实现它。

类似的事情

const TabNavigator = createBottomTabNavigator({
    Feed: FeedScreen,
    Profile: ProfileScreen,
});

TabNavigator.navigationOptions = ({ navigation }) => {
    const { routeName } = navigation.state.routes[navigation.state.index];

     // You can do whatever you like here to pick the title based on the route name
    const headerTitle = routeName;

    return {
       headerTitle,
    };
};

const AppNavigator = createStackNavigator({
    Home: TabNavigator,
    Settings: SettingsScreen,
});

Answer 2

您还可以在此处访问每个屏幕的选项卡navigationOptions，这是您想要的吗？这应该在react-navigation版本1,2。*中起作用。*我不确定3。

screen: createBottomTabNavigator(
    {
      firstTab: {
        screen: createStackNavigator({
          firstStack: {
            screen: firstStackScreen
          },
          SecondStack: {
            screen: SecondStackScreen
            }
          }
        }),
        navigationOptions: ({ navigation, screenProps }) => {}
      }
      secondTab: {
        screen: SecondTabScreen,
      }

React Navigation-访问嵌套有createStackNavigator的createBottomTabNavigator的tabBarOnPress

2 个答案: