這是一個與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粉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()); <-- };