在 ReactJS 中按下按鈕時，如何使兄弟組件的子組件刷新？

Question

所以我一直在尋找解決方案，但似乎找不到適合我正在做的事情的解決方案。 這是我的網站的結構：

https://ibb.co/Xz27rgK

如您所見，我在路由器之外有我的“NavBar”組件，因為我總是希望它被渲染。 但是我在導航欄上有一個暗模式切換，當我單擊它時，我希望它更新圖表組件的刷新（它是一個 react-chartjs-2 圖表）。

我知道你可以使用setState(); 重新渲染，但是當我運行onClick(); function 那我里面有嗎？

Answer 1

對於一個組件要觸發兄弟組件或兄弟組件的子組件的重新渲染，它們必須觸發某些共享父組件的重新渲染。 在這種情況下，所有組件都是單個根組件的子組件是有意義的，因為主題應該在整個項目中保持一致，除非您有一些特定的用例。

可能最簡單的方法是傳入回調setTheme以及來自最頂層組件的theme屬性。 在setTheme回調中，您應該調用最頂層父組件的setState ，這將觸發使用新主題重新渲染每個子組件。

在這里查看有關如何更改 React 組件主題的更詳細說明。