createNavigationContainer()已被删除错误

Fur*_*mal 0 react-native react-navigation

我正在尝试学习反应导航和反应本机。我一直在努力,现在解决了一段时间这个代码,但它的一些如何不断给我这个错误snack.expo.io的是createNavigationContainer() has been removed use createAppContainer instead

这是我的简单代码,可以得到我的第一个stacknavigator

import React from "react";
import {createStackNavigator, createAppContainer} from "react-navigation";
import {View, Text, Button} from "react-native";


class screencomponentone extends React.Component {
  render (){
    return (
      <View style=
      {{flex: 1,
        alignItems: "center" ,
        justifyContent: "center",
        borderWidth: 25,
        borderColor: "red"}}>
        <Button title= "go to screen 2" onPress = {() => {
          this.props.navigation.navigate("routetwo");
        }}/>
      </View>
    );
  }
}


class screencomponenttwo extends React.Component {
  render (){
    return (
      <View style=
      {{flex: 1,
        alignItems: "center" ,
        justifyContent: "center",
        borderWidth: 25,
        borderColor: "blue"}}>
        <Button title= "go to screen 1" onPress = {() => {
          this.props.navigation.navigate("routeone");
        }}/>
      </View>
    );
  }
}



const AppNavigator = createStackNavigator({
  "routeone" : screencomponentone,
  "routetwo" : screencomponenttwo,
})

//cause of error using old code of lecture refered from docs https://reactnavigation.org/docs/en/app-containers.html
const AppContainer = createAppContainer(AppNavigator);


export default class App extends React.Component {
  render () {
    return <AppContainer />
  }
}
Run Code Online (Sandbox Code Playgroud)

但是以某种方式尽管没有在代码中使用createNavigationContainer却一直给我这个错误

小智 7

在React Navigation 4版本中,他们更改了导入

请改变这个

import {createStackNavigator, createAppContainer} from "react-navigation";
Run Code Online (Sandbox Code Playgroud)

import { createAppContainer } from '@react-navigation/native';
import { createStackNavigator } from 'react-navigation-stack';
Run Code Online (Sandbox Code Playgroud)

加入package.json

"react-navigation": "4.0.0",
"react-navigation-stack": "1.5.1",
"@react-navigation/core": "^3.5.0",
"@react-navigation/native": "^3.6.2"
Run Code Online (Sandbox Code Playgroud)

小吃链接: https : //snack.expo.io/@mehran.khan/navigation