缺少导航道具-react-navigation V3.0

时间:2019-04-23 16:15:45

标签: react-native react-navigation

为什么我仍然收到以下消息:

"The navigation prop is missing for this navigator. In react-navigation 3 you must set up your app container directly."

这是我的代码

const DrawerNavigator = createDrawerNavigator(
  {
    Home: {
        screen: HomeScreen,
    },
    About: {
      screen: Header2,
    },
  },
  DrawerConfig
);


const MyApp11 = createAppContainer(DrawerNavigator);


export default class App12 extends React.Component {
  render() {
    return <MyApp11 />;
  }
}

使用React Native和React导航。


{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "eject": "expo eject"
  },
  "dependencies": {
    "expo": "^32.0.0",
    "prop-types": "^15.7.2",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
    "react-native-animated-hamburger": "0.0.2",
    "react-native-drawer": "^2.5.1",
    "react-native-elements": "^1.1.0",
    "react-native-vector-icons": "^6.4.2",
    "react-navigation": "^3.8.1"
  },
  "devDependencies": {
    "babel-preset-expo": "^5.0.0"
  },
  "private": true
}

1 个答案:

答案 0 :(得分:0)

根据您的代码,您以错误的方式导出导航。您不应包装导航常量来响应组件,而应直接从js文件中将其导出。

创建一个route.js文件并添加导航包装。

const DrawerNavigator = createDrawerNavigator(
  {
    Home: {
        screen: HomeScreen,
    },
    About: {
      screen: Header2,
    },
  },
  DrawerConfig
);


const MyApp11 = createAppContainer(DrawerNavigator);
export default MyApp11

现在,在app.js中将其导入并传递给组件

app.js

import Routes from 'path_to_route_file';
export default class App extends Component{
   render(){
    return(
      <View>
         <Routes />
      </View>
    )