#reactjs #react-redux #axios #redux-thunk #redux-toolkit
#reactjs #реагировать-redux #axios #redux-thunk #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, region, 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, action: PayloadAction<any>) {
state.loading = false;
},
}
Мой API конечной точки:
export const getImageProfessionApi = async (id: number, region: string, 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, а после этого снова вызывает getImageProfessionsStart, разрешающийся как бесконечный цикл.
Самое странное, что это делается так же, как и другие мои, поэтому я не могу найти, в чем проблема.
PD: Я знаю, что в моем редукторе я ничего не делаю с результатом моего get (на данный момент), но я не думаю, что это проблема.
Ответ №1:
Хорошо, это была моя ошибка. Я менял состояние загрузки в своем редукторе. Таким образом, каждый раз, когда загрузка переходит в false —> true. Мой компонент повторно отправляет запросы снова, поэтому он снова вызывает и извлекает одни и те же данные снова и снова.
Я исправил это, просто создав еще один загрузчик inistialState для моей новой выборки.
Просто к вашему сведению…