此说,自动关注元素可能会引起视力和无视线用户的可用性问题。
我将输入元素作为模态(即有条件地渲染)渲染,并且作为模态渲染,我希望将重点放在输入元素上。
另一种方法是使用 useref
挂钩进行相同的操作,但是我认为自动道具和USEREF对A11Y都有相同的影响(我不确定,因此我不确定)。
一旦渲染输入,自动对焦是一种简单的聚焦方法,当显示模式时,我认为这是A11Y的最佳方法。当在初始页面加载本身中完成自动对焦时,该错误可能适用。
this eslint says Autofocusing elements can cause usability issues for sighted and non-sighted users, alike.
I am rendering the input element as a modal(i.e conditionally rendered) and as the modal is rendered I want the focus on input element.
The other approach is to do the same using useRef
hook, But the point both autoFous prop and useRef have the same impact on a11y in my opinion(I am not sure hence asking).
The autoFocus is a easy way to focus as soon as the input is rendered and that's what I feel is best in terms of a11y when a modal is shown. The error might be applicable when autoFocus is done in the initial page load itself.
发布评论
评论(1)
我对
autocous
属性的理解是,它主要是在第一次加载页面时使用的。我已经阅读的可访问性问题(例如, autocus 属性上)是关于autofocus
当他们通常使用屏幕读取器从顶部读取页面时,将用户倾倒在页面中间底部,可以分散可访问性。在我看来,这不适用于模态,因为模态旨在吸引用户注意它。实际上, w3c wai-aria创作模态< /a> dialog states that focus should be placed on the first focusable element (eg, the input, the first paragraph, the OK button, etc.)
So, that's all to say, I think you should be fine from an accessibility standpoint to在模态首次加载时,使用
autocus
在模态中的&lt; input&gt;
元素上使用。My understanding of the
autofocus
attribute is that it's primarily used when a page first loads. The accessibility concerns I've read (e.g., Bruce Lawson's article on theautofocus
attribute) are aboutautofocus
dumping a user in the middle of a page when they'd normally use a screen reader to read a page from top to bottom, which can be distruptive for accessibility.In my view, that doesn't apply to a modal, because a modal is designed to draw the user's attention to it. In fact, the W3C WAI-ARIA Authoring Example of a modal dialog states that focus should be placed on the first focusable element (e.g., the input, the first paragraph, the OK button, etc.)
So, that's all to say, I think you should be fine from an accessibility standpoint to use
autofocus
on the<input>
element in the modal when it first loads.