0

我正在尝试设置一个特定的选项卡来启动应用程序。UI kitten 的导航，从第一个选项卡开始，实际上我希望位于第二个位置的选项卡首先出现在用户面前。我找不到如何在 UI 小猫底部标签栏中设置 initialRoute。我发布了一些代码，以便清楚：

const { Navigator, Screen } = createBottomTabNavigator();

const BottomTabBar = ({ navigation, state }) => (

  <View>
    <Divider />
    <BottomNavigation
      appearance="noIndicator"
      selectedIndex={state.index}
      onSelect={(index) => navigation.navigate(state.routeNames[index])}
    >
      <BottomNavigationTab title="screen1" icon={icon1} />
      <BottomNavigationTab title="screen2" icon={icon2} />

      <BottomNavigationTab title="screen3" icon={icon3} />
    </BottomNavigation>
  </View>
);

export const BottomTabsNavigator = () => (
  <Navigator tabBar={(props) => <BottomTabBar {...props} />}>
    <Screen name="screen1" component={Screen1}/>
    <Screen name="screen2" component={Screen2}/>
    <Screen name="screen3" component={Screen3} />
  </Navigator>
);

export const AppNavigator = () => {

  return (
  <SafeAreaView>
  <NavigationContainer>
    <Navigator headerMode='none' >
      <Screen name={'BottomTabs'} component={BottomTabsNavigator} />
    </Navigator>
  </NavigationContainer>
  </SafeAreaView>
)
};

我尝试过多个职位，但似乎没有用。

4

1 回答 1

0

在以下组件中：

<Navigator tabBar={(props) => <BottomTabBar {...props} />}>

您需要使用以下 prop: initialRouteName，如下所示：

<Navigator initialRouteName={'namehere'} tabBar={(props) => <BottomTabBar {...props} />}>

这告诉导航器在最初渲染时从哪个屏幕开始！希望这可以帮助。

对于已登陆此页面的此问题之外的任何人，您可以使用道具指定您希望导航器“启动”的屏幕：initialRouteName。然后，这会告诉导航器将其用作您的登录页面！

于 2021-10-28T14:38:43.457 回答