Typescript中带点符号的多个导出

您的第一个解决方案几乎是正确的,但您声明 Item 作为 Sidebar 类,而不是类本身。您可以通过静态属性声明来实现后者。这应该可以:

export class SidebarItem ..
..
class Sidebar extends Component<SidebarProps, SidebarState> {
  static Item = SidebarItem;
..
export default Sidebar;

你不需要排队 Sidebar.Item = SidebarItem; 还有,但你可能需要移动 SidebarItem 类,使其出现在 侧边栏 。导入将只是 import Sidebar from '...' 。

该模块在设计上有缺陷。

可以通过以下方式完成:

export class SidebarItem ...

export default class Sidebar extends Component<SidebarProps, SidebarState> {
    static Item = SidebarItem;
    ...
}

这两个组件为什么要保持这样的层次结构,这是没有充分理由的。

这是惯例 骆驼壳 如果有多个相等值的导出(哪些组件是),则使用单独的命名导出。命名导出更适合在IDE中自动导入:

export { Sidebar, SidebarItem };

Item 需要时,无法从默认导出中摇动树。 Sidebar.Item 缩小效率低于 SidebarItem 。