useConsistentCurlyBraces
诊断类别：lint/nursery/useConsistentCurlyBraces
¥Diagnostic Category: lint/nursery/useConsistentCurlyBraces
自从：v1.8.2
¥Since: v1.8.2
来源：
¥Sources:
-
灵感来自：
react/jsx-curly-brace-presence¥Inspired from:
react/jsx-curly-brace-presence
此规则强制在 JSX 属性和 JSX 子项内一致使用大括号。
¥This rule enforces consistent use of curly braces inside JSX attributes and JSX children.
对于不需要 JSX 表达式的情况，请参考 React 文档 和 有关 JSX 陷阱的此页面。
¥For situations where JSX expressions are unnecessary, please refer to the React doc and this page about JSX gotchas.
此规则将检查并警告 JSX props 和子项中不必要的大括号。
¥This rule will check for and warn about unnecessary curly braces in both JSX props and children.
¥Examples
¥Invalid
<Foo>{'Hello world'}</Foo>code-block.jsx:1:6 lint/nursery/useConsistentCurlyBraces FIXABLE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
⚠ Should not have curly braces around expression.
> 1 │ <Foo>{‘Hello world’}</Foo>
│ ^^^^^^^^^^^^^^^
2 │
ℹ JSX child does not need to be wrapped in curly braces.
ℹ Unsafe fix: Remove curly braces around the expression.
1 │ <Foo>{‘Hello·world’}</Foo>
│ -- --
<Foo foo={'bar'} />code-block.jsx:1:10 lint/nursery/useConsistentCurlyBraces FIXABLE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
⚠ Should not have curly braces around expression.
> 1 │ <Foo foo={‘bar’} />
│ ^^^^^^^
2 │
ℹ JSX attribute value does not need to be wrapped in curly braces.
ℹ Unsafe fix: Remove curly braces around the expression.
1 │ <Foo·foo={‘bar’}·/>
│ - -
<Foo foo=<Bar /> />code-block.jsx:1:10 lint/nursery/useConsistentCurlyBraces FIXABLE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
⚠ Should have curly braces around expression.
> 1 │ <Foo foo=<Bar /> />
│ ^^^^^^^
2 │
ℹ JSX attribute value should be wrapped in curly braces. This will make the JSX attribute value more readable.
ℹ Unsafe fix: Add curly braces around the expression.
1 │ <Foo·foo={<Bar·/>}·/>
│ + +
¥Valid
<> <Foo>Hello world</Foo> <Foo foo="bar" /> <Foo foo={5} /> <Foo foo={<Bar />} /></>¥Related links