Dispatcher函数在React中永远不会被调用



我在React的一个项目上工作,但是有一个问题我无法解决使用Redux。我的思路如下

export const getData = async () => {
return async(dispatch) => {
const sendRequest = async () => {
const url = '...';
const response = await fetch(url);
const data = await response.json();
return data;
}
try {
const myData = await sendRequest();
console.log(myData)
dispatch(dataActions.setData(myData))   
}
catch (error) {
console.log(error);
}
}
}

另一方面,我的切片是这样的

const initialState = {
my_data: []
};
const dataSlice = createSlice({
name: 'data',
initialState,
reducers: {
setData(state, action){
state.my_data = action.payload.myData;
}
}
})
export const dataActions = dataSlice.actions;
export default dataSlice.reducer;

在我的App.js中,我用以下代码

调用它
const data = useSelector((state)=>{return state.data.my_data})
const dispatch = useDispatch();
useEffect(()=>{
dispatch(getData);
}, [dispatch])

我使用了一些console.log()s,以找出问题可能在哪里,我发现它确实,事实上,进入getData()函数,但它从不触及返回的内容。我甚至尝试制作一个包含正在返回的代码的dispatcher()函数,但它只会被调用,如果我在getData()内部调用它,它会给我以下错误-"TypeError:调度不是一个函数…">

您需要在调度时调用getData,以便调用thinaction创建者。

useEffect(()=>{
dispatch(getData());
}, [dispatch])

最新更新