在ReactJs中组成组件

如何解决在ReactJs中组成组件

我看到某些库（例如Ant Design）具有如下所示的组件：

<Form.Item></Form.Item>

我们可以看到，上面的组件是使用.-> Form.Item创建的，就像对象一样。

有人可以举一个简单的例子说明如何创建这样的组件吗？我不知道它们是如何创建的。我了解创建<Nav/>组件时的知识，但不了解如何创建将使用.扩展的组件，例如<Nav.Home/>或<Nav.Common/>。谢谢。

解决方法

React <JSX />组件仅编译为纯JavaScript。因此，您可以像使用其他任何JavaScript值一样将它们创建为对象的属性。

const Components = {
  Friend: ({name}) => <div>I am your friend {name}</div>,}

export default function App() {
  return (
    <div className="App">
      <Components.Friend name="Jimmy" />
    </div>
  )
}