React-Redux购物车数量增减报错：state.items.find不是函数

问题根源很明确：你的state.items是对象类型（初始值设为{}），但你在incrementQuantity和decrementQuantity里调用了数组的find()方法——对象没有这个方法，所以才会抛出state.items.find不是函数的错误。

你在addToCart里已经用「商品id作为键」的对象结构存储购物车商品，所以增减数量时直接通过id访问对应商品即可，修改后的代码如下：

import { createSlice } from '@reduxjs/toolkit';

const initialState = {
  items: {},
};

const cartSlice = createSlice({
  name: 'cart',
  initialState,
  reducers: {
    addToCart: (state, action) => {
      const { id } = action.payload;
      if (state.items[id]) {
        state.items[id].quantity += 1;
      } else {
        state.items[id] = { ...action.payload, quantity: 1 };
      }
      console.log(state.items[id].quantity)
    },
    removeFromCart: (state, action) => {
      delete state.items[action.payload.id];
    },
    incrementQuantity: (state, action) => {
      // 直接通过id访问对象中的商品
      const item = state.items[action.payload];
      if (item) { // 增加判断避免无效id导致报错
        item.quantity++;
      }
    },
    decrementQuantity: (state, action) => {
      const item = state.items[action.payload];
      if (item) {
        // 数量大于1时才减少，否则保持1
        if (item.quantity > 1) {
          item.quantity--;
        }
        // 可选逻辑：如果想在数量为1时移除商品，替换成下面一行
        // item.quantity === 1 ? delete state.items[action.payload] : item.quantity--;
      }
    },
  },
});

export const { addToCart, removeFromCart, incrementQuantity, decrementQuantity } = cartSlice.actions;
export const cartReducer = cartSlice.reducer;

额外优化说明：

• 增加了商品存在性判断，避免传入无效id时出现报错
• 提供了「数量为1时移除商品」的可选逻辑，可根据需求自行切换

内容的提问来源于stack exchange，提问作者MirunaB