useAnchorContent
诊断类别：lint/a11y/useAnchorContent
¥Diagnostic Category: lint/a11y/useAnchorContent
自从：v1.0.0
¥Since: v1.0.0
来源：
¥Sources:
-
与以下相同：
jsx-a11y/anchor-has-content¥Same as:
jsx-a11y/anchor-has-content
强制锚点具有内容，并且内容可供屏幕阅读器访问。
¥Enforce that anchors have content and that the content is accessible to screen readers.
可访问意味着内容不会使用 aria-hidden 属性隐藏。参考参考资料以了解为什么这很重要。
¥Accessible means the content is not hidden using the aria-hidden attribute.
Refer to the references to learn about why this is important.
¥Examples
¥Invalid
<a />code-block.jsx:1:1 lint/a11y/useAnchorContent ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Provide screen reader accessible content when using a elements.
> 1 │ <a />
│ ^^^^^
2 │
ℹ All links on a page should have content that is accessible to screen readers.
ℹ Accessible content refers to digital content that is designed and structured in a way that makes it easy for people with disabilities to access, understand, and interact with using assistive technologies.
ℹ Follow these links for more information,
WCAG 2.4.4
WCAG 4.1.2
<a></a>code-block.jsx:1:1 lint/a11y/useAnchorContent ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Provide screen reader accessible content when using a elements.
> 1 │ <a></a>
│ ^^^^^^^
2 │
ℹ All links on a page should have content that is accessible to screen readers.
ℹ Accessible content refers to digital content that is designed and structured in a way that makes it easy for people with disabilities to access, understand, and interact with using assistive technologies.
ℹ Follow these links for more information,
WCAG 2.4.4
WCAG 4.1.2
<a> </a>code-block.jsx:1:1 lint/a11y/useAnchorContent ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Provide screen reader accessible content when using a elements.
> 1 │ <a> </a>
│ ^^^^^^^^^^^
2 │
ℹ All links on a page should have content that is accessible to screen readers.
ℹ Accessible content refers to digital content that is designed and structured in a way that makes it easy for people with disabilities to access, understand, and interact with using assistive technologies.
ℹ Follow these links for more information,
WCAG 2.4.4
WCAG 4.1.2
<a aria-hidden>content</a>code-block.jsx:1:1 lint/a11y/useAnchorContent FIXABLE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Provide screen reader accessible content when using a elements.
> 1 │ <a aria-hidden>content</a>
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^
2 │
ℹ All links on a page should have content that is accessible to screen readers.
ℹ Accessible content refers to digital content that is designed and structured in a way that makes it easy for people with disabilities to access, understand, and interact with using assistive technologies.
ℹ Follow these links for more information,
WCAG 2.4.4
WCAG 4.1.2
ℹ Unsafe fix: Remove the aria-hidden attribute to allow the anchor element and its content visible to assistive technologies.
1 │ <a·aria-hidden>content</a>
│ -----------
<a><span aria-hidden="true">content</span></a>code-block.jsx:1:1 lint/a11y/useAnchorContent ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Provide screen reader accessible content when using a elements.
> 1 │ <a><span aria-hidden=“true”>content</span></a>
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
2 │
ℹ All links on a page should have content that is accessible to screen readers.
ℹ Accessible content refers to digital content that is designed and structured in a way that makes it easy for people with disabilities to access, understand, and interact with using assistive technologies.
ℹ Follow these links for more information,
WCAG 2.4.4
WCAG 4.1.2
¥Valid
<a>content</a>function html() { return { __html: "foo" }}<a dangerouslySetInnerHTML={html()} /><a><TextWrapper aria-hidden={true} />content</a><a><div aria-hidden="true"></div>content</a>可访问性指南
Section titled 可访问性指南¥Accessibility guidelines
¥Related links