首页 > 解决方案 > 通过功能组件导入和导出多个组件

问题描述

我创建了一个名为index.js我将使用此文件作为主要导入和导出文件的文件我的项目中有两个组件,包括登录名和标题,我已在每个文件末尾按以下方法导出它们:

export {Login};
export {Header};

然后我将它们都导出index.js为以下方法:

export * from './login';
export * from './header';

App.js最后我通过这种方法将它们都导入了:

import {Login, Header} from './components/index';

它不起作用,我收到错误:不变违规:元素类型无效。
有谁知道我犯了哪一部分错误?

标签: reactjsreact-nativecomponentsexport

解决方案


如果你真的想达到你想要的。你可以改为:

export default Login;
export default Header;

在每个文件上并将其导入您的 index.js

import Login from './login';
import Header from './header';

...

export {
 Login,
 Header
}
import {Login, Header} from './components'; // you could eliminate the index

推荐阅读