2 回答

TA貢獻1796條經驗 獲得超4個贊
是的,在 React 中,數據總是沿著樹向下流動。
這些狀態管理問題確實很常見;許多庫(例如 Redux、Mobx)旨在解決這些問題,我建議您研究一下它們。
但是,如果您真的不能將這兩個組件分開,并且您現在不想學習/包含狀態管理庫,那么您可以使用上下文來線程化數據;訣竅是將回調函數與您在上下文中線程處理的數據一起傳遞。
當<SOURCE OF DATA />組件收集到新數據時,它可以使用新數據調用此回調;此回調函數(在提供者組件中定義)隨后將更新提供者的狀態,然后將導致使用新數據值對所有子組件進行全面刷新。(我在下面(非常)粗略地說明了這一點;語法會根據您是否使用鉤子而有所不同。)
PROVIDER COMPONENT:
state = data
callback = (newData) => updateState(data <= newData)
return(
<MyContext.Provide { data, callback } > // provides { data, callback }
<SOURCE OF DATA /> // consumes callback from context and invokes callback(newData)
<CONSUMER /> // consumes data/newData from context
</MyContext.Provider>
);
現在,如果您在上面指出的組件實際上都是提供者中的“兄弟”,那么您不需要上下文:通過 props 進行簡單的回調就可以了。

TA貢獻1799條經驗 獲得超9個贊
不。在 React 中,數據總是自上而下地流向樹的其余部分。上下文專門是一種使值可用于給定組件子樹的機制。上下文實例的值通常保存在 React 組件狀態中,在呈現<MyContext.Provider>
. 所以,國家也必須不負眾望。
如果你真的需要讓廣泛分離的組件像這樣與相同的數據交互,那么是時候開始考慮 Redux 或其他外部狀態管理工具了。
添加回答
舉報