What to do if react navigation reports an error

Solution to react navigation error: 1. Configure "Stack.Navigator initialRouteName="Home"", and then restart "yarn android"; 2. Delete "android\app\build\outputs\apk\debug" directory, delete the original apk package on the emulator or real machine, and then re-execute "yarn android".

The operating environment of this tutorial: Windows 10 system, react18.0.0 version, Dell G3 computer.

What should I do if I get an error in react navigation?

react-navigation error requireNativeComponent: “RNSScreenStackHeaderConfig“ was not found in the UIManage

App.tsx code:

import React from 'react';
import {
  SafeAreaView,
  ScrollView,
  StyleSheet,
  Text,
  View,
} from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
 
const Stack = createNativeStackNavigator();
 
const HomeScreen = () => {
  return (
    <View>
      <Text>首页</Text>
    </View>
  )
}
 
const MyScreen = () => {
  return (
    <View>
      <Text>我的</Text>
    </View>
  )
}
 
const App = () => {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home">
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Details" component={MyScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
};
 
const styles = StyleSheet.create({
 
});
 
export default App;

Configuration: Stack.Navigator initialRouteName=" Home", and configure at least 2 Stack.Screen pages.

Steps: Then restart yarn android. If the error requireNativeComponent: "RNSScreenStackHeaderConfig" was not found in the UIManager is still reported, you need to delete the packaged apk file in the android\app\build\outputs\apk\debug directory, and delete the original apk package on the emulator or real device. Then re-yarn Android, generate a packaged apk, and drag it to the Yeshen emulator or a real device for testing.

If the error is still reported, you may need to repeat the above steps (repeated 4 times before success).

<Stack.Navigator initialRouteName="Home">
   <Stack.Screen name="Home" component={HomeScreen} />
   <Stack.Screen name="Details" component={MyScreen} />
</Stack.Navigator>

Recommended learning: "react video tutorial"

The above is the detailed content of What to do if react navigation reports an error. For more information, please follow other related articles on the PHP Chinese website!