jsx-a11y/role-supports-aria-props Correctness
作用
强制带有显式或隐式角色定义的元素仅包含该 role 支持的 aria-* 属性。 许多 ARIA 属性（状态和属性）只能用于具有特定角色的元素上。 某些元素具有隐式角色，例如 <a href="#" />，其将解析为 role="link"。
为什么这很糟糕？
使用与元素角色不一致的 ARIA 属性会给辅助技术及其理解或使用页面内容的能力带来问题。
示例
此规则的错误代码示例：
jsx
<ul role="radiogroup" "aria-labelledby"="foo">
<li aria-required tabIndex="-1" role="radio" aria-checked="false">Rainbow Trout</li>
<li aria-required tabIndex="-1" role="radio" aria-checked="false">Brook Trout</li>
<li aria-required tabIndex="0" role="radio" aria-checked="true">Lake Trout</li>
</ul>此规则的正确代码示例：
jsx
<ul role="radiogroup" aria-required "aria-labelledby"="foo">
<li tabIndex="-1" role="radio" aria-checked="false">Rainbow Trout</li>
<li tabIndex="-1" role="radio" aria-checked="false">Brook Trout</li>
<li tabIndex="0" role="radio" aria-checked="true">Lake Trout</li>
</ul>如何使用
To enable this rule using the config file or in the CLI, you can use:
json
{
"plugins": ["jsx-a11y"],
"rules": {
"jsx-a11y/role-supports-aria-props": "error"
}
}ts
import { defineConfig } from "oxlint";
export default defineConfig({
plugins: ["jsx-a11y"],
rules: {
"jsx-a11y/role-supports-aria-props": "error",
},
});bash
oxlint --deny jsx-a11y/role-supports-aria-props --jsx-a11y-plugin版本
此规则添加于 v0.2.0。