當消費者調用時，作為上下文值傳遞的函數無法訪問更新的組件狀態

Question

我正在將一個函數作為值傳遞給Context Provider並且在從使用者調用該函數時，我得到了較舊的狀態。

Provider.jsx

const MyContext = createContext();

const Provider=()=>{
  const [someState, setSomeState] = useState();

  const providerFunction=()=>{
    // accessing someState
  }

<MyContext.Provider value={{providerFunction}}>
  <ConsumerComponent/>
</MyContext.Provider>

消費者.jsx

const {providerFunction} = useContext(MyContext);

在從Consumer.jsx調用providerFunction時，Provider.jsx 中的 providerFunction 被調用，但someState沒有獲得更新的值，它正在打印分配給它的初始值。

我無法弄清楚這是什么原因。 任何幫助表示贊賞。

Answer 1

我想通了這個問題，其實，我是用debounce在Consumer和useCallback ，我錯過了傳球providerFunction作為一個依賴。

添加依賴項后，它起作用了！