项目

此功能仍处于实验阶段。“Experimental”（实验性）意味着这是早期实现，可能会发生剧烈且破坏性的变更。

Item 与 ItemGroup 结合使用，用于显示分组并统一样式的列表项。

用法

Item 应与 ItemGroup 组件 结合使用。

import {
    __experimentalItemGroup as ItemGroup,
    __experimentalItem as Item,
} from '@wordpress/components';

function Example() {
    return (
        <ItemGroup>
            <Item>Code</Item>
            <Item>is</Item>
            <Item>Poetry</Item>
        </ItemGroup>
    );
}

属性

onClick: React.MouseEventHandler<HTMLDivElement>

处理 click 事件的事件处理程序。当定义时，Item 组件将渲染为 button（除非通过 as 属性指定其他内容）。

• 必填：否

size: ‘small’ | ‘medium’ | ‘large’

确定组件内部的填充量。

• 必填：否
• 默认值：medium

上下文

Item 使用 Context 连接到 父级 <ItemGroup /> 组件。因此，Item 从 ItemGroup 父组件接收 size 属性。

在以下示例中，<Item /> 将以 small 大小渲染：

import {
    __experimentalItemGroup as ItemGroup,
    __experimentalItem as Item,
} from '@wordpress/components';

const Example = () => (
    <ItemGroup size="small">
        <Item>...</Item>
    </ItemGroup>
);