← Back to rules

jsx-a11y/anchor-has-content 正确性

An auto-fix is available for this rule.

它的作用

强制要求锚点元素必须包含内容，并且该内容对屏幕阅读器可访问。 “可访问”意味着未通过 aria-hidden 属性隐藏。

或者，您可以使用 title 属性或 aria-label 属性。

为什么这是个问题？

没有内容的锚点元素可能会让依赖屏幕阅读器理解页面内容的用户感到困惑。

示例

此规则的 正确 代码示例：

<a>锚点内容！</a>
<a><TextWrapper /></a>
<a dangerouslySetInnerHTML={{ __html: 'foo' }} />
<a title='foo' />
<a aria-label='foo' />

此规则的 错误 代码示例：

<a />
<a><TextWrapper aria-hidden /></a>

如何使用

要通过配置文件或命令行 启用 此规则，可以使用：

配置文件 (.oxlintrc.json)

{
  "plugins": ["jsx-a11y"],
  "rules": {
    "jsx-a11y/anchor-has-content": "error"
  }
}

命令行

oxlint --deny jsx-a11y/anchor-has-content --jsx-a11y-plugin

参考资料

• 规则源码