弹出菜单: `PopoverContent` 硬编码了 `loop: true`, 因此 Tab 无法离开非模态的弹出菜单
错误
PopoverContent'通过Loop: true' to it'FocusScope' 无条件,因此Tab甚至在`模式--false-'时仍会覆盖面板的边缘。 键盘用户不能从非模式弹出式跳出 。
这不是一个焦点 * 陷阱 * —— 外部没有任何东西是隐藏的或惰性的,一个点击或一个程序焦点移动会自由离开,而 Escape close and return to the content. 但Tab,键盘用户向前进的主要方式,不能离开面板.
何处
包装/反应/流行/流行/流行/流行-tsx ' ——流行/流行 ' 使:
{\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}你觉得呢? < 焦点范围 作为儿童 循环 被困的陷阱焦点 在 MountAutoFocus 打开AutoFocus 上 在UnmountAutoFocus\on CloseAutoFocus上)
翻译:
" 被扣 " 遵循 " 模式 " ,但 " roop " 则采用硬码。
`包装/反应/焦点-瞄准镜/弧/焦点-瞄准镜.tsx ' 然后将标签处理器接上****旗:
{\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}你来干什么?
如果(被)返回,
. . . . . . . .
如果( loop) 焦点( 第一位, { 选择: true } ) ; // 向前包装
如果( loop) 焦点( 最后, { 选择: true } ); // 向后包装因此,Loop: true'在非模式案件中保持包装行为的生命力,而PopoverContent ' 则暴露出无法将其关闭。
(原始内容存档于2018-09-21) (中文(中国大陆) ). [email protected]'.
□再现.
{\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}你觉得呢? (英语). 根模式( F) <Popover.Trigger> 打开 </Popover. 触发器 > (英语). 门户 > (英语). 内容 > < input aria- label="First" / > 输入 aria- 标签 < 按钮 > 取消 </ 按钮 > < 按钮 > 拯救 </ 按钮 > </Popover. (英语). 内容 > </Popover. (英语). 门户 > </Popover. (英语). 根号 >
1. 用键盘打开弹出器.
2. " 保存 " 标签,这是面板上最后的控制。
3又贴出.
** 预计:** 焦点移动到文档中的下个可制表元素,因为弹出式是非模式的,其他页面显然仍然可用.
** 实际:** 焦点返回`First',并选定其案文,绝不离开面板。
∮为什么它很重要∮
文件记载的`模式'的用意是,弹出式后面的一页仍然可以使用,并且可以看得到辅助技术。 这为指针用户和通过虚拟Cursor导航的屏幕阅读器用户提供了支撑. 对键盘用户来说,它并不重要:对他们来说,非模式的弹出式行为完全像模式式,减去scrim.
这也使得两条解雇路线不对称. 点击外部移动焦点到点击落地之处;没有键盘等同键继续通过页面前进.
□ 建议修正
默认的 " loop " 为 " trapFocus " ,所以其模式如下:
{\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}你觉得呢?
<焦点搜索为儿童循环>\ trapFocus}被困\ trapFocus}...>或者在PopoverContent'上披露,这样消费者可以选择退出,TapFocus'已经是内部的方式。
第一种语义与人们期望的`模式'相匹配,不需要API表面。 第二,对依赖今天行为的人来说,是更安全的。
□工作,为什么它没有吸引力
截取“PopoverContent”上的 Tab 并手动移动焦点工作,但这意味着重新执行“焦点搜索”已经做的制表顺序行走,而Radix 则由“焦点”和“焦点”组成。 . . . . . . .
内容来源: radix-ui/primitives