React Redux - 在第一次渲染時未定義的狀態

Question

對於我的客戶端，我創建了一些類似測驗web應用程序的應用程序，它基於帶有巨大非常獨特數據的websockets（socket.io）的redux。沒有用戶交互，只是表示層。它的工作原理是這樣的：我通過url獲取websocket事件給我的佈局和有效載荷數據，然後渲染給定的url和fire redux動作，並將數據作爲參數，這變成了應用程序的狀態。就那麼簡單。 但是我注意到，在第一次呈現初始狀態是加載，而不是從websocket作爲參數給予行動。正如我所說的數據我得到的是巨大的，獨特的，所以我不想在減速是這樣的聲明：

pageData: { 
    assets: [], 
    questions: [], 
    details: [] 

等。它更復雜順便說一句，這只是一個例子。
取而代之的是我做了這樣的事情：

pageData: {} 

而且我希望，在視圖（使用連接）我能得到這個數據是這樣的：

this.props.view.pageData.questions 

但後來事實證明，我無法得到這個，因爲它在第一次渲染時未定義。所以我的問題是：

• 是否有訪問這個數據的第一渲染，而不 宣佈整體結構的方法嗎？

• 如果不是，我應該重建reducer中的給定數據嗎？

  • 我應該再創建減速的每一頁（有喜歡過20次 具有獨特的數據）

當然，我可以宣佈在減速的一切，但我覺得這是非常難保持這麼多數據。
但是你知道，也許我太懶惰了，我應該爲每個頁面聲明初始狀態，這個問題沒有意義;）。

Answer 1

我想你可以有幾個選擇這裏：

1. 在你的組件定義備用數據如果undefined
2. 不要使你的頁面（或組件）已收到的數據
3. 直到按照您的建議明確定義您的initialState

所有或大多數您的組件希望或應該期望某種類型的數據格式。出於這個原因，預先佈置結構（＃3）似乎是最合適的。問問你自己：如果Web套接字事件數據的格式發生變化，我的應用程序是否仍能正確顯示？

具體回答你的問題：

是否有訪問這個數據的第一渲染，而不 宣佈整體結構的方法嗎？

是的，您可以在您的綁定中使用||運算符回退（＃1）爲空數組或對象或值。示例<MyComponent listOfItems={this.props.items || []}。這有效地創建了一個空的狀態，但是，IMO應該在減速器/商店中使用initialState進行標準化。

我應該再爲每個頁面減速[？]

不一定適合每一頁減速，但所有相關數據到應用程序商店。如果不瞭解更多關於應用程序架構的信息，很難肯定地說，但保留小而明確的信息塊通常比一個大塊更容易。

我強烈主張事先定義您的數據。這聽起來可能聽起來很麻煩，但它會大大地回報，並幫助其他人瞭解應用程序的實時數據。