Item

使用法

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 は <ItemGroup /> 親コンポーネント に コンテキスト を使用して接続されています。したがって、Item は ItemGroup 親コンポーネントから size プロパティを受け取ります。

次の例では、<Item /> は small のサイズでレンダリングされます:

import {
   __experimentalItemGroup as ItemGroup,
   __experimentalItem as Item,
} from '@wordpress/components';
const Example = () => (
   <ItemGroup size="small">
   <Item>...</Item>
   </ItemGroup>
);