jsx-a11y/aria-role 正确性
它的作用
具有 ARIA 角色的元素必须使用有效的、非抽象的 ARIA 角色。角色定义的参考可在 WAI-ARIA 网站上找到。
为什么这是个问题？
此成功标准的目的是确保辅助技术（AT）能够获取有关用户界面控件的信息，激活（或设置）这些控件，并保持其状态的实时更新（例如屏幕阅读器、屏幕放大镜和语音识别软件，供残障人士使用）。
当使用可访问技术的标准控件时，这一过程是直接明了的。如果用户界面元素按照规范使用，则本条款的条件将得到满足。
然而，如果创建了自定义控件，或者在代码或脚本中编程使界面元素具有不同于常规的角色和/或功能，则需要采取额外措施，以确保控件能向辅助技术提供重要信息，并允许辅助技术对其进行控制。用户界面控件的一个特别重要的状态是它是否具有焦点。控件的焦点状态可以被程序化地确定，并且焦点变化的通知会发送给用户代理和辅助技术。其他用户界面控件状态的例子包括复选框或单选按钮是否已被选中，以及可折叠树或列表节点是否已展开或收起。
示例
此规则的错误代码示例：
jsx
<div role="datepicker"></div> <!-- 错误："datepicker" 不是 ARIA 角色 -->
<div role="range"></div> <!-- 错误："range" 是一个 _抽象_ ARIA 角色 -->
<div role=""></div> <!-- 错误：不允许空的 ARIA 角色 -->
<Foo role={role}></Foo> <!-- 错误：ignoreNonDOM 设置为 false 或未设置 -->此规则的正确代码示例：
jsx
<div role="button"></div> <!-- 正确："button" 是一个有效的 ARIA 角色 -->
<div role={role}></div> <!-- 正确：role 是一个变量，其值只能在运行时确定。 -->
<div></div> <!-- 正确：没有 ARIA 角色 -->
<Foo role={role}></Foo> <!-- 正确：ignoreNonDOM 设置为 true -->配置
此规则接受一个配置对象，包含以下属性：
allowedInvalidRoles
type: string[]
default: []
除了 ARIA 规范之外，还应允许的自定义角色。
ignoreNonDOM
type: boolean
default: false
决定是否检查开发者创建的组件。
如何使用
要通过配置文件或 CLI 启用此规则，可以使用：
json
{
"plugins": ["jsx-a11y"],
"rules": {
"jsx-a11y/aria-role": "error"
}
}bash
oxlint --deny jsx-a11y/aria-role --jsx-a11y-plugin