Redux вопрос новичка

Я сделал некоторый store, который выполняет роль корзины интернет-магазина. Здесь я могу добавить объект и удалить его. После удаления, я не могу вновь выбрать тот же объект и добавить, однако могу добавлять другие объекты. При удалении других объектов, история повторяется с ошибкой: "Uncaught TypeError: "itemCounter" is read-only". Подскажите, как правильно удалить объект и сохранить возможность снова добавить его??

Реьюсеры выглядят так:

const toolkitSlice = createSlice({
    name: 'toolkit',
    initialState,
    reducers: {
        addProduct(state, action) {
            state.store.push(action.payload)
            console.log(action.payload)
        },
        removeProduct(state, action) {
            state.store =  state.store.filter((item) => action.payload.id !== item.id);
            console.log(state.store)
            state.counter = initialState.counter;
        },

        increment(state) {
            state.counter = state.counter + 1;
        },

        decrement(state) {
            if(state.counter > 0) {
                state.counter  = state.counter - 1;
            }
        },

increment и decrement задают количество выбранного пользователем товара Структура товара следующая:

Object {
      color: "white"
      description: "Some name"
      enable: true
      id: 1
      itemCounter: 1
      name: "img.png"
      price: 59.99 
}

itemCounter создаётся в объекте и устанавливается из counter при нажатии кнопки добавления товара в корзину и может быть разным для каждого выбранного товара. itemCounter может быть изменён, что отразится на его цене

    CounterChangerDecrement(state, action) {
        const func = (counter, price) => {
            let newPrice = price / (counter + 1)
            if(counter <= 0) {
                counter = 1;
                return newPrice*counter;
            }
            return (newPrice * counter);
        }
        state.store.map((item) => ((item.id === action.payload.id) && (item.itemCounter >= 1)) ?
            (item.itemCounter--) && (item.price = func(item.itemCounter, item.price))
            : null
        );
    },

    CounterChangerIncrement(state, action) {

        const func = (counter, price) => {
            let newPrice = (price / (counter - 1));
            return newPrice * counter;
        }
        state.store.map((item) => item.id === action.payload.id ?
            (item.itemCounter++) && (item.price = func(item.itemCounter, item.price))
            : null
        );
    },
}

Как это исправить? Помогите!


Ответы (0 шт):