javascript - 如何将连接、组件和功能导出到一处？ (只需要建议)

Question

问题:我在下面收到此错误。该错误意味着我没有正确导入或导出模块。

expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

• 我想在一个地方导入三种不同类型的模块。

  import {
      DrawerItem,
      DrawerItems,
      ToggleDrawer }         from '../elements/drawer'; <- calling directory.index
  

• 这是抽屉/index.jsx。这样我们就可以在一处导入Drawer相关的组件。

  export * from './drawer_header';
  export * from './drawer_item';
  export * from './drawer_items';
  export * from './drawer';
  export * from './toggle_drawer';
  

1) 这是 DrawerItem -- 具有 connect 的组件

class DrawerItem extends PureComponent {
...
const drawer_component = connect(
    ({ ui }) => ({
        is_portfolio_drawer_on: ui.is_portfolio_drawer_on,
        togglePortfolioDrawer : ui.togglePortfolioDrawer,
    })
)(DrawerItem);

export { drawer_component as DrawerItem };

2)这是 DrawerItems - 普通组件

class DrawerItems extends PureComponent {
...
export default { DrawerItems };

3)这是 ToggleDrawer - 普通组件

class ToggleDrawer extends React.PureComponent { 
...
export default { ToggleDrawer };

你发现什么问题了吗？会出现什么问题？

Answer 1

如果您想像在 drawer/index 中那样导入和导出它们，请在 ToggleDrawer 和 DrawerItems 中导出时删除 default .jsx