在App.js中将默认路由页面设置为主页时出错-React

时间:2018-10-05 13:44:33

标签: reactjs react-native ecmascript-6 es6-class

我是React Native的新手,我想在我的应用程序中将默认屏幕设置为主屏幕。

这是我的家庭组件

import React, {Component} from 'react';
import {Text, View} from 'react-native';

class Home extends Component {
  render() {
    return (
     <View>
      <Text>Hello! I'm Home component</Text>
     </View>
   );
  }
}

export default Home

以下是我的App.js文件

import React, {Component} from 'react';
import { createStackNavigator } from 'react-navigation';
import { Home } from './app/components/Home';

export default createStackNavigator({
   home: Home
});

构建后,它将在模拟器中引发以下错误。

路线“ home”的组件必须是React组件。有人可以告诉我我在哪里做错了。

2 个答案:

答案 0 :(得分:2)

像这样解决:

import Home from './app/components/Home';

答案 1 :(得分:1)

您在App.js中错误地导入Home

应为import Home from './app/components/Home';

默认导出不需要在导入它们的文件中进行分解。

本文可以提供更多的见解:https://medium.com/@etherealm/named-export-vs-default-export-in-es6-affb483a0910