# Dividers

v-divider コンポーネントは、リストまたはレイアウトのセクションを分離するために使用されます。

# 使い方

最も単純なDividerは、水平線を表示します。

# API

# サンプル

# Props

# Inset

Insetディバイダは72px右に移動されます。 これで、リスト項目と一致するようになります。

# Vertical

垂直区切り線により、独自のレイアウトのためのツールが増えます。

# その他

# Portrait View

ユースケースに合わせてカスタムカードを作成します。

# Subheaders

区切り線とサブヘッダーは、コンテンツを分割するのに役立ち、オプションで同じinset propを使用して互いに並べることができます。

# アクセシビリティ

v-divider コンポーネントは、デフォルトでは WAI-ARIA ロールの separator が割り当てられます。このロールは、ディバイダが「コンテンツのセクションやメニュー項目のグループを分離して区別する」ことを意味します。 ただし、仕切りがインターフェイスの見栄えを良くするための手段にすぎない場合もあります。 このような場合、「暗黙のネイティブロールのセマンティクスがアクセシビリティAPIにマッピングされない要素」を示すpresentation のロールを使用する必要があります。 v-divider のデフォルトのseparatorロールをオーバーライドするには、コンポーネントにrole="presentation" propを追加してください。 さらに、 v-divider コンポーネントは aria-orientation="horizontal" があります。 vertical="true"の場合、 aria-orientation="vertical" も自動的に設定されます。 role="presentation"の場合、aria-orientation="undefined"がデフォルト値となります。

準備はできましたか?

Vuetifyのチームが選ぶ関連コンテンツで他の学習トピックに進むか、下のナビゲーション リンクでページ間を移動できます。
GitHub でこのページを編集する
最終更新日:10/07/2024, 11:31:37 AM