有効なアクセシビリティ状態
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
React Nativeコンポーネントが有効なaccessibilityStateプロパティを使用することを要求するルール
Not for use with personal data
ルールID: has-valid-accessibility-state
コンポーネントの現在の状態を支援技術のユーザーに説明します。
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"]} />