React Navigation v6 usePreventRemoveContext 是未定义错误

Question

TypeError: (0, _$$_REQUIRE(_dependencyMap[1], "@react-navigation/native").usePreventRemoveContext) is not a function. (In '(0, _$$_REQUIRE(_dependencyMap[1], "@react-navigation/native").usePreventRemoveContext)()', '(0, _$$_REQUIRE(_dependencyMap[1], "@react-navigation/native").usePreventRemoveContext)' is undefined)

This error is located at:
    in NativeStackViewInner (at NativeStackView.native.tsx:420)
    in RNCSafeAreaProvider (at SafeAreaContext.tsx:87)
    in SafeAreaProvider (at SafeAreaProviderCompat.tsx:46)
    in SafeAreaProviderCompat (at NativeStackView.native.tsx:419)
    in NativeStackView (at createNativeStackNavigator.tsx:72)
    in Unknown (at createNativeStackNavigator.tsx:71)
    in NativeStackNavigator (at App.js:19)
    in EnsureSingleNavigator (at BaseNavigationContainer.tsx:430)
    in BaseNavigationContainer (at NavigationContainer.tsx:132)
    in ThemeProvider (at NavigationContainer.tsx:131)
    in NavigationContainerInner (at App.js:18)
    in App (at renderApplication.js:50)
    in RCTView (at View.js:32)
    in View (at AppContainer.js:92)
    in RCTView (at View.js:32)
    in View (at AppContainer.js:119)
    in AppContainer (at renderApplication.js:43)
    in hello_world(RootComponent) (at renderApplication.js:60)

我是反应原生和反应导航的新手。我正在尝试使用 React navigation v6，并且只是运行入门指南。我收到了这个我以前从未见过的错误。我可以很好地运行一些基本页面。然而，每当我添加导航时，我都会收到这个不寻常的错误。我已尽我所能遵循所有指南，并使用

npx react-native init

命令创建了原始文件夹。这是我的 App.js 文件的副本，这是我除了 MainActivity.java 之外唯一更改的文件，我在其中添加了 React 导航 v6 的先决条件 onCreate 函数。这直接来自他们的网站：https://reactnavigation.org/docs/hello-react-navigation/。我真的不知道为什么会出现这个问题。如果您需要更多信息，请随时留下反馈。我们将不胜感激所有帮助。

import * as React from 'react';
import { View, Text } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';

function HomeScreen() {
  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Text>Home Screen</Text>
    </View>
  );
}

const Stack = createNativeStackNavigator();

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home">
        <Stack.Screen name="Home" component={HomeScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

Answer 1

这是某种兼容性问题。由

npm update

修复。任何了解更多的人都可以详细说明，但情况已经解决了。

Answer 2

当我重写 YouTube 的一个项目时，我遇到了同样的问题。我会安装 @react-navigation/native": "^6.0.11"，我会安装旧版本的 "@react-navigation/native": "^6.0.6"，并且 “@react-navigation/native-stack”：“^6.2.5”，。之后就成功了。

Answer 3

我遇到了这个问题，因为我有旧版本的

@react-navigation/core

。 确保您拥有与

@react-navigation/native

列出的依赖项兼容的版本。

就我而言，我删除了 package.json 中的显式覆盖并运行

npm update @react-navigation/core