Context 通過組件樹提供了一個傳遞數據的方法,從而避免了在每一個層級手動的傳遞 props 屬性
Context 設計目的是為共享那些被認為對于一個組件樹而言是“全局”的數據,例如當前認證的用戶、主題或首選語言。例如,在下面的代碼中,我們通過一個“theme”屬性手動調整一個按鈕組件的樣式:

使用 context, 我可以避免通過中間元素傳遞 props:

- 不要僅僅為了避免在幾個層級下的組件傳遞 props 而使用 context,它是被用于在多個層級的多個組件需要訪問相同數據的情景。
-
父組件 Provider 提供上下文 value
下面代碼中,父組件引入了實例,并且通過
MyContext.Provider將父組件包裝,并且通過Provider.value將方法提供出去。 -
3、子組件 useContext 解析上下文
下面是子組件,相同的,也需要從
context-manager中引入 MyContext 這個實例,然后才能通過const { setStep, setNumber, setCount, fetchData } = useContext(MyContext);解析出上下文中的方法,在子組件中則可以直接使用這些方法,修改父組件的 state。
浙公網安備 33010602011771號