在应用程序中将默认路由页面设置为主页时出错.js - 反应

Question

我是 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

以下是我的应用程序.js文件

import React, {Component} from 'react';
import { createStackNavigator } from 'react-navigation';
import { Home } from './app/components/Home';
export default createStackNavigator({
home: Home
});

构建后，它会在模拟器中抛出以下错误。

路由"home"的组件必须是 React 组件。有人可以告诉我我哪里做错了。

Answer 1

像这样修复：

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

Answer 2

您在应用程序中错误地导入了主页.js

应该是import Home from './app/components/Home';

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

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