@stylistic/jsx/

jsx-first-prop-new-line

强制 JSX 中第一个属性的正确位置。

规则详情

此规则检查所有 JSX 元素的第一个属性是否放置正确。以下是可能的配置

• always: 第一个属性应始终放在新行。
• never : 第一个属性不应放在新行，例如，应始终与组件开始标签位于同一行。
• multiline: 当 JSX 标签跨越多行时，第一个属性应始终放在新行。
• multiprop: 除非有多个属性，否则第一个属性不应放在新行。
• multiline-multiprop: 如果 JSX 标签跨越多行并且有多个属性，则第一个属性应始终放在新行上。这是default值。

当配置为"always"时，此规则的错误代码示例

<Hello personal={true} />

<Hello personal={true}
    foo="bar"
/>

当配置为"always"时，此规则的正确代码示例

<Hello
    personal />

<Hello
    personal
/>

当配置为"never"时，此规则的错误代码示例

<Hello
    personal />

<Hello
    personal
/>

当配置为"never"时，此规则的正确代码示例

<Hello personal={true} />

<Hello personal={true}
    foo="bar"
/>

当配置为"multiline"时，此规则的错误代码示例

<Hello personal
    prop />

<Hello foo={{
}} />

当配置为"multiline"时，此规则的正确代码示例

<Hello personal={true} />

<Hello
    personal={true}
    foo="bar"
/>

当配置为"multiline-multiprop"时，此规则的错误代码示例

<Hello foo={{
    }}
    bar />

当配置为"multiline-multiprop"时，此规则的正确代码示例

<Hello foo={{
}} />

<Hello
    foo={{
    }}
    bar
/>

规则选项

"@stylistic/jsx/jsx-first-prop-new-line": `"always" | "never" | "multiline" | "multiprop" | "multiline-multiprop"`

何时不使用它

如果您没有使用 JSX，则可以禁用此规则。