← Back to rules

jsx-a11y/anchor-has-content Correctness

💡 A suggestion is available for this rule for some violations.

它的作用

强制要求锚点具有内容，并且该内容对屏幕阅读器可访问。 可访问意味着它没有使用 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>

如何使用

To enable this rule using the config file or in the CLI, you can use:

Config (.oxlintrc.json)

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

Config (oxlint.config.ts)

import { defineConfig } from "oxlint";

export default defineConfig({
  plugins: ["jsx-a11y"],
  rules: {
    "jsx-a11y/anchor-has-content": "error",
  },
});

CLI

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

版本

此规则在 v0.0.18 中添加。

参考资料

• Rule Source
• Open rule in Oxc Playground