哪個是最好的選擇，以將許多道具附加到子組件？

使用react 15.5.4哪個是最好的選擇，以將許多道具附加到子組件？

我有一個組件已經配置爲在其子中跨越props。

export default class Component extends React.Component { 

    render() { 
    return (
     <TemplateAbout 
     header={{ 
     title: 'WHY US', 
     description: 'Our Team Member share the same Vision', 
     }} 
     /> 
    ); 
    } 
}

我想將Component的界面變成NewComponent如下面的例子。

export default class NewComponent extends React.Component { 

    render() { 
    return (
     <TemplateAbout> 
     <Header title="WHY US" description="Our Team Member share the same Vision" /> 
     </TemplateAbout> 
    ); 
    } 
}

哪種方法可以做到這一點？

來源

2017-06-05 Adrien Gadaud

您可以使用對象傳播語法通過道具JSX。它將與道具的其餘部分相結合。

render() { 
    const header = { 
     title: 'WHY US', 
     description: 'Our Team Member share the same Vision', 
    } 
    return (
     <TemplateAbout> 
     <Header otherProps="otherValue" {...header} /> 
     </TemplateAbout> 
    ); 
    } 
}

來源

2017-06-05 05:21:08

我的錯誤，我只是更新我的問題。 –

我不明白你真正想達到什麼目的，如果你需要單獨的道具來逐個傳遞，我不認爲有這麼簡單的方法。 –

我會說，在TemplateAbout的每個子元素中，從'TemplateAbout'和'contextType'使用'getChildContext'可以做到這一點。每次getChildContext變化返回一個不同的對象時，你可能不得不重新渲染所有的孩子。（待證實，也許'componentWillUpdate'具有相同的上下文）。 @EvanSebastian這是你想到的困難方式嗎？ – BigDong

哪個是最好的選擇，以將許多道具附加到子組件？

回答

相關問題