简写属性

Semantic UI React 组件可以使用“简写”。例如，Button 组件有一个 icon 简写，其值定义了将要渲染的图标。

可以使用几种简写值形式，但它们都有一个共同点——最终都会被评估为 React 元素。因此，您可以将简写值视为自定义渲染的 React 元素的配方。

对象作为值

每个组件的简写都有一个关联的默认元素类型。例如，默认情况下，Button 的 icon 简写渲染了 <Icon /> 元素。可以通过提供 props 对象作为简写值来自定义此默认元素的 props。

字符串作为值

定义默认元素 props 的方法更加简洁，可以使用原始值。在这种情况下，提供的简写值将被视为此元素的“默认 prop”的值。

之所以可以这样操作，是因为 name 是简写的 <Icon /> 元素的默认 prop。

禁用简写渲染

也可以传递假值（false、null 或 undefined） - 在这种情况下，组件的简写将不会渲染任何内容。

React 元素作为值

在某些情况下，可能需要自定义将作为简写值渲染的元素树。回到 Button 的例子，我们可能想要渲染 <i /> 而不是默认的 <Icon /> 元素。在这种情况下，可以直接提供必要的元素作为简写值。

由于此限制，您应该尽可能努力使用其他简写值的选项 - 例如，以下是前面示例的重写方式。

但是，仍然可能存在无法使用简写值的“对象”形式的情况 - 例如，您可能想要为简写渲染一些自定义元素树。在这种情况下，应该使用函数值。

通过 children 渲染 props

将函数作为简写值提供是最复杂但同时也是自定义组件简写最强大的选项。它应该返回 React 元素作为结果或 null。

自定义渲染的简写

当渲染函数在以下情况下非常有用时，还有一个用例 - 这种情况是为简写渲染自定义元素树。您可能还记得，当直接提供 React 元素作为简写值时，可能会出现一个问题 - 在这种情况下，props 不会传播到渲染的元素中。为了避免这种情况，应该考虑以下策略。

函数作为值（已弃用）

将函数作为简写值提供是最复杂但同时也是自定义组件简写最强大的选项。此函数的唯一要求是

• 它应该同步完成
• 它应该返回 React 元素作为结果

因此，在最简单的形式下，它可以按以下方式使用。