1

私はネイティブに反応するのが初めてで、この質問が誰かに尋ねられたのを見たことがないか、これを回避する方法を見つけていません。

expo で反応ナビゲーション 5 を使用します。

現在、私は次のアプリ構造を持っています:ドロワーナビゲーター内のスタックナビゲーター。

Example of page structure:
Drawer Navigator ( links ):
Home (RouteStack)
Screen 1 
Screen 2
Screen 3

RouteStack( screens) :
Home ( initial route )
Screen 1
Screen 2
Screen 4

ドロワー ナビゲーター ロード RouteStack: Screen 1/Screen 2 で Screen 1/Screen 2 リンクを取得するにはどうすればよいですか? これらのリンクは、必要な画面に簡単にジャンプできるように提供されています。

これを達成する方法についてのガイダンスが必要です。

スタック内のドロワーの可能性を考えましたが、スタックにリストされていない可能性のあるドロワー内の画面があります。したがって、引き出しの中に積み重ねて行きました。

また、RouteStack 内で navigation.navigate(route.name) を実行しようとしました

サンプルコード: 引き出しナビゲーター:

<NavigationContainer>
      <Drawer.Navigator drawerContent={(props, navigation) => <CustomDrawerContent {...props} {...navigation} />}>
        <Drawer.Screen name="Home" component={RouteStack} />
        <Drawer.Screen name="MyItems" component={RouteStack} />
        <Drawer.Screen name="ContactRep" component={RouteStack} />
        <Drawer.Screen name="Settings" component={SettingInfo} />
      </Drawer.Navigator>
    </NavigationContainer>

スタック ナビゲーター (RouteStack) は次のようになります。

   <Stack.Navigator
      initialRouteName="Home"
      screenOptions={{ gestureEnabled: false, headerTitleAlign: 'auto' }}
    // headerMode="float"
    >
      <Stack.Screen
        name="Home"
        component={HomeScreen}
        options={{
          title: '',
          headerStyle: {
            backgroundColor: '#fff',
          },
          headerTintColor: '#000',
          headerTitleStyle: {
            fontWeight: 'bold'
          },
          headerLeft: props => <HeaderLeftMenu {...props} />,
          headerRight: props => <HeaderRightMenu {...props} />,
          headerTitle: props => <HeaderTitle {...props} />
        }}
      />
      <Stack.Screen
        name="ContactRep"
        component={ContactRep}
        options={{ headerTitle: props => <HeaderTitle {...props} /> }}
      />
      <Stack.Screen
        name="MyItems"
        component={MyItems}
        options={{ headerTitle: (props, navigation) => <HeaderTitle {...props} /> }}
           />

    </Stack.Navigator>

事前に感謝し、助けていただければ幸いです。

4

1 に答える 1