Redux-toolkit如何防止store重复项，重复添加商品时更新数量

问题原因 #

现有代码无法正常工作的核心原因如下：

• 缺少分支判断逻辑：无论是否匹配到已存在的同ID商品，都会无条件执行数组追加操作，必然会产生重复条目
• 商品结构缺失数量字段：原始商品数据没有quantity属性，即使匹配到重复商品也没有可更新的计数载体
• 调试误区：Redux Toolkit 默认使用 Immer 包装 state，直接打印 state 拿到的是代理对象，不是原生JS值，容易误导调试结果，需要用已导入的current方法包裹state才能拿到真实值。如果find结果始终为undefined，优先检查传入action.payload._id的类型是否和存储的商品_id类型一致（比如是否一个是字符串、一个是对象类型ID）。

可直接运行的修复代码 #

调整reducer逻辑，新增分支判断，给首次加入购物车的商品初始化数量字段，匹配到已有商品时仅更新数量：

import { createSlice, current } from "@reduxjs/toolkit";

const initialState = {
  product: [],
};

export const cartSlice = createSlice({
  name: "cart",
  initialState: initialState,
  reducers: {
    addproduct: (state, action) => {
      const targetProductId = action.payload._id;
      // 用findIndex性能更好，方便后续直接通过索引修改
      const existProductIndex = state.product.findIndex((item) => item._id === targetProductId);

      if (existProductIndex !== -1) {
        // 商品已存在，数量+1即可
        state.product[existProductIndex].quantity += 1;
      } else {
        // 商品不存在，新增条目并初始化购买数量为1
        state.product.push({
          ...action.payload,
          quantity: 1
        });
      }
    },
    // 可选配套方法：减少商品数量
    decreaseProduct: (state, action) => {
      const targetProductId = action.payload._id;
      const existProductIndex = state.product.findIndex((item) => item._id === targetProductId);
      if (existProductIndex === -1) return;
      
      if (state.product[existProductIndex].quantity > 1) {
        state.product[existProductIndex].quantity -= 1;
      } else {
        // 数量减到0时直接从购物车移除
        state.product.splice(existProductIndex, 1);
      }
    }
  },
})

export const { addproduct, decreaseProduct } = cartSlice.actions;
export default cartSlice.reducer;

注意事项 #

• 调用addproduct时传入的payload必须携带和商品库一致的字符串类型_id字段，不要传入ObjectId等其他类型，否则全等匹配会失效
• Immer 支持直接修改数组索引、调用push/splice等变更方法，不需要手动展开数组生成新引用
• 调试state时务必使用current(state)获取原生数据，避免代理对象导致的打印结果异常

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