Skip to content
← Back to rules

jsx-a11y/no-distracting-elements Correctness

它的作用

强制不使用会分散注意力的元素。

为什么这不好?

在视觉上会分散注意力的元素可能会给有视力障碍的用户带来可访问性问题。 这类元素很可能已经被弃用,应当避免。默认情况下,<marquee><blink> 元素 会分散视觉注意力,并可能引发前庭系统障碍。

示例

以下是此规则的错误代码示例:

jsx
<marquee />
<marquee {...props} />
<marquee lang={undefined} />
<blink />
<blink {...props} />
<blink foo={undefined} />

以下是此规则的正确代码示例:

jsx
<div />
<Marquee />
<Blink />

配置

此规则接受一个包含以下属性的配置对象:

elements

type: array

要检查的会分散注意力的元素列表。

elements[n]

type: "marquee" | "blink"

如何使用

To enable this rule using the config file or in the CLI, you can use:

json
{
  "plugins": ["jsx-a11y"],
  "rules": {
    "jsx-a11y/no-distracting-elements": "error"
  }
}
ts
import { defineConfig } from "oxlint";

export default defineConfig({
  plugins: ["jsx-a11y"],
  rules: {
    "jsx-a11y/no-distracting-elements": "error",
  },
});
bash
oxlint --deny jsx-a11y/no-distracting-elements --jsx-a11y-plugin

版本

此规则是在 v0.0.22 中添加的。

参考资料