有効なアクセシビリティ状態

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard
Free Trial
Not for use with personal data

ルールID: has-valid-accessibility-state

WCAG 2.0(A) 4.1.2

コンポーネントの現在の状態を支援技術のユーザーに説明します。

accessibilityState はオブジェクトです。次のフィールドが含まれています。

名前 説明 タイプ 必須
disabled 要素が無効かどうかを示します。 ブール値 いいえ
selected 選択可能な要素が現在選択されているかどうかを示します。 ブール値 いいえ
checked チェック可能な要素の状態を示します。このフィールドは、boolean または「mixed」文字列を使用して混合チェックボックスを表すことができます。 ブール値または「mixed」 いいえ
busy 要素が現在ビジーかどうかを示します。 ブール値 いいえ
expanded 展開可能な要素が現在展開されているか折りたたまれているかを示します。 ブール値 いいえ

使用するには、 accessibilityState を特定の定義を持つオブジェクトに設定します。

なぜ重要なのか

accessibilityState フィールドは正しく綴られ、意図されたアクセシビリティ状態を説明するのに妥当な値に対応しなければなりません。許可されている値に従わないと、支援技術のユーザーにアクセスできないコンポーネントが生じます。

問題の解決方法

accessibilityState プロップがフィールドを有効な名前とタイプの値に設定したオブジェクトであることを確認してください。

成功例

<TouchableOpacity accessibilityState={{ checked: true }} />
<TouchableOpacity accessibilityState={{ checked: "mixed" }} />
<TouchableOpacity accessibilityState={{ checked: true, disabled: true }} />

失敗例

<TouchableOpacity accessibilityState="selected" />
<TouchableOpacity accessibilityState={{ disabled: "true" }} />
<View accessibilityStates={["checked"]} />

リソース