通过添加标签来使图标无障碍。
通过包装图标并提供有意义的标签，快速使任何图标无障碍。
没有视觉差异，但屏幕阅读器会正确宣布。
大小 1.58 kB
从命令行安装组件。
npm install @radix-ui/react-accessible-icon
导入组件。
import * as AccessibleIcon from '@radix-ui/react-accessible-icon'; export default () => <AccessibleIcon.Root />;
包含要使之无障碍的图标。
label*
字符串
大多数图标或图标系统都没有内置无障碍功能。例如，相同的视觉 交叉 图标实际上可能意味着 "关闭" 或 "删除"。此组件允许您为应用程序中使用的图标赋予意义。
这是使用 视觉隐藏 构建的。