傳遞多個孩子的最佳方式是什麼？

很清楚做什麼，如果我們需要通過兒童名單：傳遞多個孩子的最佳方式是什麼？

export const SomeWrapper = ({ children }) => (
    <div className="list-of-something"> 
     {children} 
    </div> 
); 

<SomeWrapper> 
    <C1 /> 
    <C2 /> 
</SomeWrapper>

但是，什麼是要通過幾個孩子具有不同的父母最好的方法是什麼？

export const SomeWrapper = ({ component1, component2 }) => (
    <div className="list-item"> 
     <div className="name"> 
      {component1} 
     </div> 
     <div className="whatever"> 
      {'Whatever'} 
     </div> 
     <div className="value"> 
      {component2} 
     </div> 
    </div> 
); 

<SomeWrapper component1={<C1 />} component2={<C2 />} />

我不確定這是最好的解決方案。做這個.props.children [0]和this.props.children [1]看起來也很奇怪。

在這種情況下你會提出什麼建議？

來源

2016-02-22 Ross Khanas

ReactJS的最好的做法是通過一個單一的成分作爲子

<Parent> 
    <Child/> 
</Parent>

或均勻陣列的陣列作爲這樣

<Parent> 
    [<Child key='c1'/>, <Child key='c2' />] 
</Parent>

在你的情況下，最好不要將一個容器/組件作爲屬性放在父組件中。只是通過一些靈長類動物的價值（在最淺的普通對象）作爲母公司的屬性，並構建在那個特定的父對象這樣的子組件：

//SomeWrapper 
const SomeWrapper = ({c1, c2}) => (
<Parent> 
    <ChildItemA title={c1.title} ... /> 
    <ChildItemB title='Whatever' ... /> 
    <ChildItemC title={c2.title} ... /> 
</Parent>); 

//Usage 
<SomeWrapper c1={c1_obj} c2={c2_obj} />

來源

2016-02-22 13:56:55 Yman

傳遞平原對象是不會在這裏工作，因爲孩子組件可以有不同的類型。還有一個選擇是傳遞每個組件的反應類，屬性和子項，並使用React.createElement（class，props，children）創建一個實例。但我不認爲這種方法是最好的。 –

傳遞多個孩子的最佳方式是什麼？

回答

相關問題