微调控制项
旋转器用于通知商家他们的操作正在处理中。对于加载状态,旋转器应该只用于不能用骨架加载组件表示的内容,比如数据图表。
用于通知商家他们请求的操作正在处理中。
进口{微调控制项}从“@shopify /北极星”;进口反应从“反应”;函数SpinnerExample(){返回<转轮accessibilityLabel=“转轮榜样”大小=“大”/>;}
道具
想让这个功能变得更好吗?请分享你的反馈.
接口
SpinnerProps
- 大小? “小”|“大”
-
旋转器的尺寸。
默认为“大”.
- accessibilityLabel? 字符串
-
旋转器的可访问标签。
- hasFocusableParent? 布尔
-
允许组件基于焦点应用正确的可访问性角色。
可访问性
svg通常不一致地传达给辅助技术。的微调控制项
组件的可访问性也与上下文高度相关。当父组件可聚焦时,您需要设置hasFocusableParent
为适当的道具角色
要应用的属性。
为了获得最佳的用户体验,请使用accessibilityLabel
道具要让辅助技术使用者知道旋转器的用途。
最佳实践
spinner组件应该:
- 通知商家他们的请求已经收到,操作将很快完成。
- 不用于给整个页面加载的反馈。
- 白色只能用于按钮等可操作组件的小旋转器。
- 在web上,它与骨架加载一起使用,以表示非排版内容。例如,商家分析仪表板上的线形图。
内容的指导方针
可访问性标签
微调器辅助标签应该:
- 准确地解释请求操作的状态。例如,“加载”、“提交”、“处理”。
- 用尽可能少的词来描述这个状态。