react/no-children-prop 正確性

✅ 此規則預設為開啟。

此規則的作用

子元件應始終是實際的子元件，而不是作為屬性傳遞。

使用 JSX 時，子元件應巢狀於開頭和結尾標籤之間。

不使用 JSX 時，子元件應作為額外參數傳遞給 React.createElement。

範例

此規則的錯誤程式碼範例

<div children='Children' />

<MyComponent children={<AnotherComponent />} />
<MyComponent children={['Child 1', 'Child 2']} />
React.createElement("div", { children: 'Children' })

此規則的正確程式碼範例

<div>Children</div>
<MyComponent>Children</MyComponent>

<MyComponent>
  <span>Child 1</span>
  <span>Child 2</span>
</MyComponent>

React.createElement("div", {}, 'Children')
React.createElement("div", 'Child 1', 'Child 2')

參考資料

• 規則來源