有什么文件或者例子可以参考吗?我不知道如何开始..
感谢您考虑将可访问性作为组件库的一部分。
我将从
react-aria
开始,特别是无头钩子,它可以集成到任何具有适当 DOM 结构的 React 组件中。
钩子实现 ARIA 行为并提供应用于 React 组件的必要属性。
例如,假设您已经实现了 Tabs 模式。
首先,您需要集成
useTabListState()
中的 @react-stately/tabs
钩子以响应鼠标、触摸和键盘事件。
它生成的
state
对象将被传递到以下 @react-aria/tabs
钩子,每个钩子都会公开要应用于各自元素的必要 DOM/ARIA 属性:
useTabList()
useTab()
useTabPanel()
您可以进一步查看 Github 上的 docs 和 source code。
如果您不想集成库或发现挂钩不符合人体工程学,您可以从它们中汲取灵感并以类似的方式编写自己的库,以保持辅助功能与渲染的其余部分隔离。