如何在父組件的道具發生變化時停止重新渲染子組件？

Question

我有一個Modal是Card組件的子組件：

Card > Modal

Card有它發送到Modal的道具。 當我 select Modal的 UI 中的一個選項時，它會更新Card中的數據，從而重新呈現Card ，同時關閉Modal 。

這並不理想，因為我希望用戶繼續使用Modal ，直到他們明確點擊“關閉”。

有沒有辦法更新底層Card中的數據/狀態（以便Modal可以使用新狀態），但在Modal最終關閉之前不會觸發組件樹的完全重新渲染？

現在沒有涉及 Redux，如果可能的話我想避免它。

Answer 1

每當 state 更新時，所有使用 state 及其子組件的組件都會重新呈現。 您可能應該使用反應門戶來實現您對模態的需求。 文檔鏈接的末尾有一個小提琴。 文檔： https://reactjs.org/docs/portals.html