如何解决使用Redux Toolkit进行分派时的无限循环
我正在学习React-Toolkit,但是我一直在努力解决这个无限循环。 首先,我称此取自:
const dispatch = useDispatch();
useEffect(() => {
dispatch(getImageProfession(profession.id,region,token));
},[]);
然后在我的rootSlice.ts中:
export const getImageProfession = (id: number,region: string,token: string): AppThunk => async(dispatch) => {
try {
dispatch(getImageProfessionsStart());
const imageData = await getImageProfessionApi(id,token);
dispatch(getImageProfessionsSuccess(imageData));
} catch (err) {
dispatch(getImageProfessionsFailure(err));
}
};
我的CreateSlice:
export const rootSlice = createSlice({name: 'root',initialState,reducers: {
getImageProfessionsStart(state) {
state.loading = true;
},getImageProfessionsSuccess(state,action: PayloadAction<any>) {
state.loading = false;
},getImageProfessionsFailure(state,
}
我的Endpoint API:
export const getImageProfessionApi = async (id: number,token: string): Promise<any> => {
const namespace = `namespace=static-${region}`;
const locale = 'en_GB';
const { data: responseData } = await axios.get(
${link}
);
return responseData.assets[0].value;
};
由于某种我不理解的原因,请先调用getImageProfessionsStart,然后再执行axios get,然后再调用getImageProfessionsStart,以inifnite循环的方式解决。
最奇怪的是,此操作与我的其他操作一样完成,所以我找不到问题所在。
PD:我知道在我的reducer中,我目前没有对get的结果做任何事情,但是我不认为这是问题所在。
解决方法
好吧,这是我的错误。我正在更改减速机的加载状态。所以每次加载变为false-> true。我的组件再次渲染,因此再次调用并一次又一次地获取相同的数据。
我修复了这个问题,只是为我的新提取创建了另一个inistialState加载器。
仅供参考...
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。