首頁  >  問答  >  主體

按下按鈕後,dispatch函數無效

這是一個與redax一起使用的動作函數(它完美地工作,因為我使用了它)

export const fetchCategory = () => {
  return async (dispatch) => {
    try {
      dispatch(settingsSlice.actions.settingsFetching());
      const response = await request("/category/getAll", "POST", {});
      dispatch(settingsSlice.actions.settingsFetchingSuccess(response));
    } catch (e) {
      dispatch(settingsSlice.actions.settingsFetchingError(e));
    }
  };
};

當按鈕被按下時,我需要向伺服器發出請求並更新狀態

這是當您點擊按鈕時執行的函數:

const buttonHandler = async () => {
    await request("/category/create", "POST", {
      newCategory: {
        label: form.categoryLabel,
        limit: form.categoryLimit,
      },
    });
    setForm(initialState);
    fetchCategory();
  };

我已經檢查過,表單已經發送到後端,除了"fetchCategory"之外,一切正常

我已經嘗試使用useEffect來解決這個問題

useEffect(() => {
    fetchCategory();
  }, [Button , buttonHandler]);

我嘗試安裝不同的依賴項,但沒有結果。如何解決這個問題?

P粉410239819P粉410239819423 天前441

全部回覆(1)我來回復

  • P粉704196697

    P粉7041966972023-09-17 14:40:47

    你需要 dispatch 這個動作!

    你的 fetchCategory 函式是一個 "thunk action creator"。呼叫 fetchCategory() 會建立一個 thunk 動作,但不會對其執行任何操作。你需要呼叫 dispatch(fetchCategory()) 來執行這個動作。

    const buttonHandler = async () => {
        await request("/category/create", "POST", {
          newCategory: {
            label: form.categoryLabel,
            limit: form.categoryLimit,
          },
        });
        setForm(initialState);
    --> dispatch(fetchCategory()); <--
    };

    回覆
    0
  • 取消回覆