在线文档教程
Eslint
规则 | Rules

jsx-quotes

在JSX属性中强制使用双引号或单引号(jsx-quotes)

--fix命令行上的选项可以自动修复一些被这条规则反映的问题。

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 jsx-quotes: ["error", "prefer-double"]*/ <a b='c' />

具有默认选项的此规则的正确代码示例"prefer-double"

/*eslint jsx-quotes: ["error", "prefer-double"]*/ <a b="c" /> <a b='"' />

prefer-single

此规则的错误代码示例包含以下"prefer-single"选项:

/*eslint jsx-quotes: ["error", "prefer-single"]*/ <a b="c" />

此规则的正确代码示例包含以下"prefer-single"选项:

/*eslint jsx-quotes: ["error", "prefer-single"]*/ <a b='c' /> <a b="'" />

何时不使用它

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

相关规则

  • quotesVersion 这个规则是在 ESLint 1.4.0.Resources 中引入的