反应导航停止底部栏上的后退按钮行为

Question

嘿，我正在使用 React Navigation 中的 createBottomTabNavigator()，并且我有一个自定义顶栏，我使用自己的状态进行更新。问题是，当我单击选项卡时，每次导航都会调用侦听器，因此如果您转到屏幕 2，顶栏会进入错误状态，屏幕 2 的顶栏会更改。当我按下顶栏后退按钮时，它会返回到屏幕 1 并将顶栏更改为屏幕 1 顶栏。现在，如果我使用底部栏选项卡而不是使用顶部栏选项来导航，它会使顶部栏远离屏幕 2。所以我的问题是我是否可以以某种方式禁用如果我按下底部栏它导航回初始屏幕1.

 <Tab.Screen
      listeners={() => {
              switchTab(0);
            }}
            name="Input"
            children={() => (
              <SuchStackContainer
                ref={suchStackRef}
                switchStack={switchStack}
                listings={listings}
                setListings={setListings}
              />
            )}
            options={{
              tabBarLabel: 'Suche',
              tabBarIcon: ({color, size}) => (
                <Ionicons name="car" color={color} size={size} />
              ),
            }}
          />

Answer 1

我假设你正在使用来自 React Navigation 的 Bottom Tabs Navigator。如docs 中所述，您可以覆盖onPress 方法并将其导航到所需的选项卡。这些可以在Tab.navigator 的screenOptions 属性或Tab.Screen 的选项属性下指定。如果您还需要我的帮助，请告诉我

function MyTabBar({ navigation }) {
  return (
    <Button
      title="Go somewhere"
      onPress={() => {
        // Navigate using the `navigation` prop that you received
        navigation.navigate('SomeScreen');
      }}
    />
  );
}