Javascript 导出要导入的模块，如Grid和Grid.Item

我希望能够使用如下两个组件：

<Grid>
  <Grid.Item>A</Grid.Item>
  <Grid.Item>B</Grid.Item>
</Grid>

A.
B

---

如何将这些组件导出为如上所述的可导入组件？

您可以将其导出为：

export const Item () => // render Item code

class Grid extends Component {
  // Component code...
}
Grid.Item = Item
export default Grid;

---

这正是从

react语义ui

包导出

Grid

的方式

const myComponent = () => // code
const mySubComponent1 = () => // code
const mySubComponent2 = () => // code

myComponent.mySubComponent1 = mySubComponent1;
myComponent.mySubComponent2 = mySubComponent2;

export default myComponent;

---

您需要导出具有组件属性的对象

import React from 'react';

export default {
  Grid: function Grid() { return <div>grid</div>},
  Item: function Item() { return <li>I am item</li> },
};

// usage
import Components from '..';

<Components.Grid>
  <Components.Item />
</Components.Grid>

从“React”导入React；
导出默认值{
Grid:function Grid（）{return Grid}，
项：函数项（）{return
我是项
}，
};
//用法
从“..”导入组件；

Hi-mate，答案相同，但默认导出后不需要箭头功能Hi-mate，IE

import Grid from'my package'

查看其他答案。