如何將具有大量屬性的對象作爲道具傳遞給React元素？

請你能幫我理解什麼是對應React元素的相應JSX語法？如何將具有大量屬性的對象作爲道具傳遞給React元素？

const data = { 
    className: "myEl", 
    "data-numb": 3, 
    "data-created": 191017 
    //following other 20 attributes 
} 
React.createElement("div",data,"test");

我猜你會不會寫在JSX語法此元素以這種方式

<div className="myEl" data-numb=3 data-created=191037 ....the other 20 attributes.... />

那麼，什麼是通過作爲道具的陣營元素，有一個巨大的物體的理想方式屬性的數量？

來源

2017-10-17 marco

爲什麼不只是在子組件中傳遞data = data和access作爲this.props.data.className？ –

@chandrasugur - 使用淺等於比較（反正在PureComponents上）對狀態和道具進行重新渲染的目的將是避免這種情況的一個原因。 – Adam

@Adam很高興認識這個。謝謝。 –

據我明白你問這個：

const data = { 
    className: "myEl", 
    "data-numb": 3, 
    "data-created": 191017 
    //following other 20 attributes 
} 

<div {...data}/>

來源

2017-10-17 23:21:56

這被稱爲「傳播」語法。 –

-1

爲什麼不使用的數據存儲解決方案與終極版？然後，對於需要來自商店的任何數據的每個組件，您可以通過mapStateToProps將任何您想要的狀態傳遞給組件。從長遠來看，這會讓你更容易，特別是因爲它聽起來像你有很多你正在使用的數據。您現在可以使用Alexander的答案，但是如果您還沒有使用數據管理解決方案，那麼您很快就會想要一個。將這個答案與亞歷山大的答案結合起來，在那裏你將所有的數據都傳遞給一個單一的對象，我認爲你的生活會更容易。如果您還不熟悉REDX，請務必查看：http://redux.js.org/

mapStateToProps函數是react-redux庫的一部分，該庫用於將反應連接到redux存儲庫。這篇文章here是一個很好的幫助，如果你試圖圍繞它的實際做法，以及你應該如何使用你的反應應用程序的REDX。

來源

2017-10-18 00:07:18 Dude

如何將具有大量屬性的對象作爲道具傳遞給React元素？

回答

相關問題