- 如何告訴「遙遠」的組件重新渲染？

Question

在我的Web應用程序的右上角，如果用戶當前登錄，則顯示用戶名，如果不是，則顯示「未登錄」。該組件通過檢查redux中的密鑰來獲取有關用戶登錄狀態的信息。

用戶通過訪問登錄表單登錄。登錄表單和右上角登錄狀態是非常獨立的組件，它們都是reactjs組件層次結構深入分離的分支。

我只是無法圍繞如何獲得右上角條登錄狀態來重新呈現用戶通過登錄表單成功登錄後的情況。

任何人都可以建議我應該做什麼？

Answer 1

不要再考慮一個組件導致另一個組件重新渲染。在您的店鋪發生變化後，您的組件應該重新呈現。它不應該知道是什麼改變了這一變化。

有幾種方法可以聆聽您商店中的變化，最流行的是react-redux。它將允許您將想要重新呈現的組件打包到已知有關您的商店的連接的容器中，並取決於其某些數據。

當您的容器關心的數據片段發生變化時，它會將React組件重新呈現在其中。

1. <SignInForm />發送一個動作。
2. 你的一個減速器計算出一個新的狀態。
3. 您的<TopRightLoginBar />容器重新呈現。