有没有办法让抽屉在反应原生博览会中从堆栈导航返回后保持打开状态答案

【问题标题】：is there any way to keep drawer opened after back from stack navigation in react native expo有没有办法让抽屉在反应原生博览会中从堆栈导航返回后保持打开状态
【发布时间】：2022-08-08 19:42:03
【问题描述】：

我创建了抽屉导航，里面有堆栈导航，当从堆栈返回时需要打开抽屉

我的代码是这样的，我只需要在从任何堆栈屏幕返回后保持抽屉打开

const Drawer = createDrawerNavigator();
function DrawerNav({ navigation }) {
  // toggleDrawer = () => {
  //   this.props.navigation.dispatch(DrawerActions.toggleDrawer())
  // }
  
  return (
    <Drawer.Navigator initialRouteName=\"Home\" 
      screenOptions={{
        headerShown: true,
        headerStyle: {
          backgroundColor: brand,
        },
        headerTintColor: primary,
        headerTransparent: false,
        headerTitle: \'\',
        headerLeftContainerStyle: {
          paddingLeft: 20,
        },
    }}>
      <Drawer.Screen name=\"Home\" component={HomeScreen} options={horizontalAnimation}/>
      <Drawer.Screen name=\"RootStack\" component={RootStack} />
    </Drawer.Navigator>
  );
}

const Stack = createStackNavigator();
const RootStack = () => {
  return (
          <Stack.Navigator
            screenOptions={{
              headerStyle: {
                backgroundColor: brand,
              },
              headerTintColor: primary,
              headerTransparent: true,
              headerTitle: \'\',
              headerLeftContainerStyle: {
                paddingLeft: 20,
              },
            }}
            
          >
            {storedCredentials ? (
              <Stack.Screen name=\"Home\" component={DrawerNav} options={horizontalAnimation}/>
              
            ) : (
              <>
                <Stack.Screen name=\"Login\" component={Login} options={horizontalAnimation}/>
                <Stack.Screen name=\"Signup\" component={Signup} options={horizontalAnimation}/>
              </>
            )}
          </Stack.Navigator>
        </NavigationContainer>
  );
};

这些是安装的包

\"@react-navigation/drawer\": \"^6.1.8\",
\"@react-navigation/native\": \"^6.0.6\",
\"@react-navigation/stack\": \"^6.0.11\",

你找到任何解决方案了吗？
不，我没有找到任何解决方案@KishanBarmawala

标签： react-native navigation-drawer

【解决方案1】：

<Drawer.Navigator
      drawerContent={(props) => <CustomDrawerContent {...props} />}
      >
      <Drawer.Screen
        name="RootStack"
        component={RootStack}
      />
     
 </Drawer.Navigator>

customDrawerContent ：包含要在侧栏上列出的项目的组件：检查此链接以获取该部分https://stackoverflow.com/a/64173773/7689878。

要在向后导航后实现抽屉剩余，请在 Drawer Navigator 中仅保留 RootStack（应包含所有堆栈屏幕）。

【讨论】：

【解决方案2】：

用这种方式...

function MyDrawer() {
  const dimensions = useWindowDimensions();

  return (
    <Drawer.Navigator
      screenOptions={{
        drawerType: 'permanent',
      }}
    >
      {/* Screens */}
    </Drawer.Navigator>
  );
}

参考this

【讨论】：