什么是＆＃34; as＆＃34;语义 - 反应组件中的道具？

Question

as在语义-UI-react中的大多数组件中定义为An element type to render as (string or function).。这是什么意思？

我的理解是它以某种方式改变了as中的组件。

示例：

https://react.semantic-ui.com/modules/sidebar 已Sidebar as={Menu}，孩子为<Menu.Item name='...'>，没有启动菜单所需的典型<Menu/>。

Answer 1

此功能称为扩充，您可以控制呈现的HTML标记或将一个组件呈现为另一个组件。额外的道具将传递给您渲染的组件。它允许组合组件功能和道具，而无需添加额外的嵌套组件。

Sidebar的示例显示Sidebar会将其子项呈现给Menu。这也可以通过以下方式编写，但这会产生额外的标记，这并不总是正确的，并且可能会破坏样式。

<Sidebar>
  <Menu>
    <Menu.Item />
  </Menu>
</Sidebar>

标签的基本示例：

<Button /> // will produce <button class='ui button' />
<Button as='a' /> // will produce <a class='ui button' />

react-router的示例：

<Menu.Item as={Link} to='/home' /> // will produce <a class="item" href="/home">