我應該在哪里從Reactjs應用程序中獲取數據？

Question

我一直在創建一個Reactjs應用程序。 我遇到了一個問題，想知道從Firebase哪里獲取數據。 在根組件（App.jsx）或單個組件中獲取數據集合是否更好？

現在，我有用戶，產品和銷售集合。 一些組件使用相同集合中的數據。 例如：“付款”組件還使用“銷售”收款數據進行分析。

情況1：如果我在根組件中獲取數據，則不必在組件內部獲取數據。

情況2：如果我在組件內部獲取數據，則將針對不同路徑中的不同組件獲取兩次相同的數據。

請給我建議更好的處理情況的方法。

Answer 1

您在問題中標記了Redux ，所以我假設您在React App中使用了Redux ？

如果您正在使用Redux ，請將所有提取內容放入actions文件中。 如果還有其他正在偵聽受提取影響的狀態的組件，它將自動重新呈現組件數據。 無需您進行兩次提取。

Answer 2

情況1：-如果您從根組件中獲取所有數據。 一開始您將要處理大量數據，這會減慢應用程序的初始加載速度（但對於非常小的應用程序應該沒問題）。 不建議用於中大型應用程序。
情況2：-這種方法很好，但是會增加所有組件的較小延遲（用於從API獲取數據），但是如果您擔心帶寬使用和延遲。 您應該考慮使用像redux這樣的統一數據存儲。 使用來自redux / thunk等的action / sideEffects一次獲取數據，並將其保存在redux存儲中。 在所有其他組件中消耗相同的數據。