jsx-quotes

强制在 JSX 属性中一致地使用双引号或单引号

🔧

此规则报告的一些问题可以通过 --fix 命令行选项自动修复

重要提示

此规则在 ESLint v8.53.0 中已弃用。请使用 @stylistic/eslint-plugin-js 中的对应规则。

了解更多

JSX 属性值可以包含字符串字面量，它们可以使用单引号或双引号分隔。

<a b='c' />;
<a b="c" />;
1
2

与 JavaScript 中的字符串字面量不同，JSX 属性中的字符串字面量不能包含转义引号。例如，如果你想在 JSX 属性值中包含双引号，你必须使用单引号作为字符串分隔符。

<a b="'" />;
<a b='"' />;
1
2

规则详情

此规则强制在 JSX 属性中一致地使用双引号或单引号。

此规则有一个字符串选项

使用默认 "prefer-double" 选项时，此规则的错误代码示例

在 Playground 中打开

/*eslint jsx-quotes: ["error", "prefer-double"]*/

<a b='c' />;
1
2
3

使用默认 "prefer-double" 选项时，此规则的正确代码示例

在 Playground 中打开

/*eslint jsx-quotes: ["error", "prefer-double"]*/

<a b="c" />;
<a b='"' />;
1
2
3
4

使用 "prefer-single" 选项时，此规则的错误代码示例

在 Playground 中打开

/*eslint jsx-quotes: ["error", "prefer-single"]*/

<a b="c" />;
1
2
3

使用 "prefer-single" 选项时，此规则的正确代码示例

在 Playground 中打开

/*eslint jsx-quotes: ["error", "prefer-single"]*/

<a b='c' />;
<a b="'" />;
1
2
3
4

如果你不使用 JSX，或者你不关心 JSX 属性中引号使用的一致性，你可以关闭此规则。

此规则在 ESLint v1.4.0 中引入。

编辑此页