多個React組件體系結構

Question

我正在創建一個實時儀表板，其中使用了一個用於數據的API。該應用程序是構建在節點API之上的同構反應應用程序，我使用的是Flux架構，更具體地說是alt implementation。

我的問題是儀表盤有大約4/5的實時圖表（我用a React D3 library)，每個排行榜中調用API端點。我有一個主<Dashboard />成分，這裏面每個圖表組件的生命。我的問題是應該的<Dashboard />是負責監聽數據並將其作爲道具傳遞，或者應該由每個圖組件負責其自己的商店/操作生命週期？如果我將數據作爲道具傳遞，這意味着UI會退回比所需更多的數據嗎？

我還沒有找到React/Dashboard/Charting應用程序的任何示例，所以如果有人知道這將是非常有用的

Answer 1

最好將API訪問權限保留在頂層，並通過道具傳遞所有內容。考慮將來自API的數據放入商店，並使用它來驅動頂級組件。它不是被困在子組件

測試都被簡化，因爲你可以通過 -

• 你現在有一個以上的地方使用相同的數據的自由：做這樣的實際優勢在一些虛擬道具，並確認你得到正確的結果
• 它更容易推理：子組件不再需要關心的，他們的數據來自

來到關於你提到的有關性能問題的實施細則：考慮使用pure render mixin，並且只更新需要更改的商店部分。這樣，你的圖表組件可以很快地告訴任何事情已經改變，並且如果沒有改變，它將不會重新渲染。