同时使用抽屉导航和堆栈导航。

Question

我想在零食博览上的抽屉导航里面嵌套一个堆栈导航。我之前问过这个问题，但被告知要重新做一遍。 我做了，但还是出现了错误。 最初我使用了一个类，所以我尝试使用一个函数来代替。如果有人能解释一下我到底做错了什么，我会非常感激。如果有帮助的话，我也可以把我的项目链接贴出来。https:/snack.expo.io@andreeamit-in-the valley。

我得到的错误是

Device: (0:0) Cannot assign to read only property 'exports' of object '#<Object>'
  Evaluating module://react-native-screens.js
  Evaluating module://@react-navigation/drawer.js
  Evaluating module://App.js.js
  Loading module://App.js

谢谢你了

这是我的代码

import * as React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';
import { createDrawerNavigator } from '@react-navigation/drawer';

import SignIn from './components/SignIn';
import ForgotPassword from './components/ForgotPassword';
import Dashboard from './components/Dashboard';
import Advertisers from './components/advertisers';
import Adverts from './components/Adverts';
import Stats from './components/Stats';
import Plans from './components/Plans';
import About from './components/about';
import ManageAdvert from './components/ManageAdvert';

const Stack = createStackNavigator();

function Root () {
     return (
  <Stack.Navigator
      initialRouteName="SignIn"
      screenOptions={{
        headerTitleAlign: 'center',
        headerStyle: { backgroundColor: '#2d3436'},
        headerTintColor: '#fff',
        headerTitleStyle: { fontWeight: 'bold'}
      }}>


      <Stack.Screen 
        name="Reset your password" 
        component={ForgotPassword} 
        options={
          {title: 'Reset your password'},
          {headerLeft: null} 
        } 
        />

      <Stack.Screen 
        name="SignIn" 
        component={SignIn} 
        options = {
          {headerShown: false,
          title: 'SignOut'}
        }
      />
      <Stack.Screen 
       name="Dashboard" 
       component={Dashboard} 
      />

      <Stack.Screen 
        name="Advertisers" 
        component={Advertisers} 
        options={
          {title: 'Advertisers'}
        } 
      />

      <Stack.Screen 
        name="Adverts" 
        component={Adverts} 
        options={
          {title: 'Adverts'}
        } 
      />
      <Stack.Screen 
        name="Stats" 
        component={Stats} 
        options={
          {title: 'Stats'}
        } 
      />
      <Stack.Screen 
        name="Plans" 
        component={Plans} 
        options={
          {title: 'Plans'}
        } 
      />

      <Stack.Screen 
        name="Manage Adverts" 
        component={ManageAdvert} 
        options={
          {title: 'Manage Adverts'}
        } 
      />
    </Stack.Navigator>
  );
}

const Drawer = createDrawerNavigator();

export default function App () {
  return (
    <NavigationContainer>
      <Drawer.Navigator initialRouteName="Root">
        <Drawer.Screen name="Root" component={Root} />
        <Drawer.Screen name="About" component={About} />
      </Drawer.Navigator>
    </NavigationContainer>
  );
}

Answer 1

修正了，看这里的零食=&gt。https:/snack.expo.io@mustafaskiree857b

刚刚更新了package.json中的包，应该可以解决这个问题。

以下是我更新的软件包，我必须在我的账户中重新发布。

    "react-native-paper": "^3.10.1",
    "react-native-screens": "^2.4.0",
    "@react-navigation/stack": "^5.3.7",
    "react-native-reanimated": "^1.8.0",
    "@react-navigation/drawer": "^5.7.5",
    "@react-navigation/native": "^5.4.0",
    "react-native-safe-area-context": "^0.7.3",
    "@react-native-community/masked-view": "^0.1.7"