useKeyWithMouseEvents
¥Summary
-
规则生效日期:
v1.0.0¥Rule available since:
v1.0.0 -
诊断类别:
lint/a11y/useKeyWithMouseEvents¥Diagnostic Category:
lint/a11y/useKeyWithMouseEvents -
此规则为推荐规则,默认启用。
¥This rule is recommended, which means is enabled by default.
-
此规则没有修复方案。
¥This rule doesn’t have a fix.
-
此规则的默认严重级别为 error。
¥The default severity of this rule is error.
-
来源:
¥Sources:
¥How to configure
{ "linter": { "rules": { "a11y": { "useKeyWithMouseEvents": "error" } } }}¥Description
强制 onMouseOver / onMouseOut 伴随 onFocus / onBlur。
¥Enforce onMouseOver / onMouseOut are accompanied by onFocus / onBlur.
代码审查不再需要重新格式化请求和周期性争论。
¥Coding for the keyboard is important for users with physical disabilities who cannot use a mouse, AT compatibility, and screenreader users.
¥Examples
¥Invalid
<div onMouseOver={() => {}} />code-block.jsx:1:1 lint/a11y/useKeyWithMouseEvents ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ onMouseOver must be accompanied by onFocus for accessibility.
> 1 │ <div onMouseOver={() => {}} />
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
2 │
ℹ Actions triggered using mouse events should have corresponding events to account for keyboard-only navigation.
<div onMouseOut={() => {}} />code-block.jsx:1:1 lint/a11y/useKeyWithMouseEvents ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ onMouseOut must be accompanied by onBlur for accessibility.
> 1 │ <div onMouseOut={() => {}} />
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
2 │
ℹ Actions triggered using mouse events should have corresponding events to account for keyboard-only navigation.
¥Valid
<> <div onMouseOver={() => {}} onFocus={() => {}} /> <div onMouseOut={() => {}} onBlur={() => {}} /> <div onMouseOver={() => {}} {...otherProps} /> <div onMouseOut={() => {}} {...otherProps} /> <div onMouseOver={() => {}} onFocus={() => {}} {...otherProps} /> <div onMouseOut={() => {}} onBlur={() => {}} {...otherProps} /></>可访问性指南
Section titled “可访问性指南”¥Accessibility guidelines
¥Related links
Biome v2.1 中文网 - 粤ICP备13048890号