react/void-dom-elements-no-children 正确性

✅ 此规则默认启用。

作用

禁止空 DOM 元素（例如 <img />、<br />）接收子元素。

它为什么不好？

有些 HTML 元素只能自闭合（例如 img、br、hr）。这些元素通常被称为空 DOM 元素。此规则检查是否将子元素传递给空 DOM 元素。

示例

该规则错误的代码示例

<br>Children</br>
<br children='Children' />
<br dangerouslySetInnerHTML={{ __html: 'HTML' }} />
React.createElement('br', undefined, 'Children')
React.createElement('br', { children: 'Children' })
React.createElement('br', { dangerouslySetInnerHTML: { __html: 'HTML' } })

该规则正确的代码示例

<div>Children</div>
<div children='Children' />
<div dangerouslySetInnerHTML={{ __html: 'HTML' }} />
React.createElement('div', undefined, 'Children')
React.createElement('div', { children: 'Children' })
React.createElement('div', { dangerouslySetInnerHTML: { __html: 'HTML' } })

引用

• 规则来源