Инвариант не сработал: Была обнаружена мутация состояния между отправками, в пути 'cart.itemsPrice'. Это может привести к некорректному поведению
У меня есть страница размещения заказа, и я не могу перейти к размещению заказа из-за этой ошибки. Я не вижу, где именно происходит изменение состояния, я думаю, что это потому, что переменные динамические, но это все равно не имеет смысла для меня.
Вот моя страница:
Мое действие:
import axios from "axios";
import {
ORDER_CREATE_REQUEST,
ORDER_CREATE_SUCCESS,
ORDER_CREATE_FAIL,
ORDER_CREATE_RESET,
} from "../constants/orderConstants";
export const createOrder = (order) => async (dispatch, getState) => {
try {
dispatch({
type: ORDER_CREATE_REQUEST,
});
const {
userLogin: { userInfo },
} = getState();
const config = {
headers: {
"Content-type": "application/json",
Authorization: `Bearer ${userInfo.access}`,
},
};
const { data } = await axios.post(`/api/orders/add/`, order, config);
dispatch({
type: ORDER_CREATE_SUCCESS,
payload: data,
});
} catch (error) {
dispatch({
type: ORDER_CREATE_FAIL,
payload:
error.response && error.response.data.detail
? error.response.data.detail
: error.message,
});
}
};
Ошибка возникает на строке 56. Я подумал, что это может быть как-то связано с переменной itemsPrice, поэтому я закомментировал ее, но это все переменные, которые выдают ошибку. Я попробовал запустить функцию createOrder до диспетчеризации и после нее, но все равно возникла та же ошибка. Я прочитал на этой странице об ошибке, но ничего не понял.
Я не уверен, почему это происходит, учитывая тот факт, что все переменные, которые я использую, полностью в порядке и видны на странице. Действие даже не запускается, когда должно, из-за этой ошибки.
РЕДАКТИРОВАТЬ: Это мой редуктор заказов:
import {
ORDER_CREATE_REQUEST,
ORDER_CREATE_SUCCESS,
ORDER_CREATE_FAIL,
ORDER_CREATE_RESET,
} from "../constants/orderConstants";
export const orderCreateReducer = (state = {}, action) => {
switch (action.type) {
case ORDER_CREATE_REQUEST:
return {
loading: true,
};
case ORDER_CREATE_SUCCESS:
return {
loading: false,
success: true,
order: action.payload,
};
case ORDER_CREATE_FAIL:
return {
loading: false,
error: action.payload,
};
case ORDER_CREATE_RESET:
return {};
default:
return state;
}
};
После некоторого разговора в комментариях нам понадобилось больше контекста, поэтому мы создали git и открыли pull request с потенциальным решением.
См. github Pull request: https://github.com/StHeisenberg/ProjectRepo/pull/1