当我拖动以打开侧边菜单时，React Drawer 导航不起作用（没有任何反应）

Question

我正在尝试在 StackNavigation 下引入 DrawerNavigation。 我的 StackNavigation 工作正常。但是当我拖动屏幕时，DrawerNavigation 不工作。 没有任何反应...也没有错误。

我正在为列表项使用 TouchableOpacity。虽然我不这么认为，但是否有可能由于第一次接触列表项而发生？？？如果没有，那么任何人都可以指出我的问题是什么吗？非常感谢您提供的任何帮助。

我在这里给出了我的 Navigator.Js 代码 和一个 视频 Url 以更好地理解正在发生的事情对于我的情况。

视频URL-https://drive.google.com/file/d/1MhD3gB8Pp4tqbXr1HktOPa-2xOqW0xoA/view?usp=sharing

Answer 1

不要将 DrawerNavigator 包装在 StackNavigator 中，而是将 StackNavigator 包装在 DrawerNavigator 中。

工作示例： Expo Snack

输出：

import * as React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import Constants from 'expo-constants';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import { createDrawerNavigator } from '@react-navigation/drawer';

const Drawer = createDrawerNavigator();
const Stack = createStackNavigator();
const StackNav = () => {
  return (
    <Stack.Navigator>
      <Stack.Screen name="Login" component={() => <Text>Login</Text>} />
      <Stack.Screen name="Register" component={() => <Text>Register</Text>} />
    </Stack.Navigator>
  );
};
export default function App() {
  return (
    <View style={styles.container}>
      <NavigationContainer>
        <Drawer.Navigator>
          <Drawer.Screen name="Stack" component={StackNav} />
          <Drawer.Screen
            name="HomeNews"
            component={() => (
              <View style={styles.container}>
                <Text>HomeNews</Text>
              </View>
            )}
          />
          <Drawer.Screen
            name="StateNews"
            component={() => (
              <View style={styles.container}>
                <Text>StateNews</Text>
              </View>
            )}
          />
        </Drawer.Navigator>
      </NavigationContainer>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    paddingTop: Constants.statusBarHeight,
    backgroundColor: '#ecf0f1',
  },
});