@stylistic/

jsx-quotes

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

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

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

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

规则详情

此规则强制在 JSX 属性中始终使用双引号或单引号。

选项

此规则有一个字符串选项

• "prefer-double"（默认）强制对所有不包含双引号的 JSX 属性值使用双引号。
• "prefer-single" 强制对所有不包含单引号的 JSX 属性值使用单引号。

prefer-double

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

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

<a b=
'c'
 />;

不正确

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

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

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

正确

prefer-single

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

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

<a b=
"c"
 />;

不正确

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

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

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

正确

何时不使用它

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