react/void-dom-elements-no-children Correctness
它的作用
禁止空的 DOM 元素（例如 <img />、<br />）接收子元素。
为什么这不好？
有一些 HTML 元素只能是自闭合的（例如 img、br、hr）。这些统称为空的 DOM 元素。 此规则检查是否将子元素传递给空的 DOM 元素。
示例
此规则的错误代码示例：
jsx
<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' } })此规则的正确代码示例：
jsx
<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' } })如何使用
To enable this rule using the config file or in the CLI, you can use:
json
{
"plugins": ["react"],
"rules": {
"react/void-dom-elements-no-children": "error"
}
}ts
import { defineConfig } from "oxlint";
export default defineConfig({
plugins: ["react"],
rules: {
"react/void-dom-elements-no-children": "error",
},
});bash
oxlint --deny react/void-dom-elements-no-children --react-plugin版本
此规则在 v0.2.11 中添加。