时间戳

首页 > 解决方案 > 如何导出带有相关“子”组件的 React 组件

reactjs - 如何导出带有相关“子”组件的 React 组件

问题描述

我已经看到一些库支持执行以下操作的能力

<Table>
    <Table.Row>This would replace importing a component called TableRow separately.</Table.Row>
</Table>

不确定这是否是不好的做法，但想知道你是如何做到的。

标签： reactjs

解决方案

您可以通过将子组件添加到父组件对象并导出父组件来执行此操作。不是完全不好的做法，但它可以帮助保持组件的有序性。

import React from 'react';

const Row = ({children}) => <span>{children}</span>;

const Table = ({children}) => <>{children}</>;

Table.Row = Row;

export default Table;

推荐阅读