You need to enable JavaScript to run this app. Flutter电商如何实现不同尺寸同款商品加入购物车时新增条目?
优惠活动
大模型
产品
解决方案
定价
更多

Flutter电商如何实现不同尺寸同款商品加入购物车时新增条目?

解决方案

你当前代码的判断逻辑仅以productId作为购物车条目去重标识,同款商品的不同规格参数没有纳入去重判断,因此会触发数量叠加逻辑。

实现步骤
  • 第一步:调整购物车条目的唯一识别规则,将商品ID + 规格尺寸组合为唯一key,例如拼接为$productId|$size格式,不同尺寸的同款商品会生成不同的key
  • 第二步:修改addItem方法中的存在性判断、更新、新增逻辑,全部改用组合key操作
  • 可选优化:如果后续还有颜色、版本等其他规格维度,直接追加到组合key的拼接规则中即可适配
优化后代码
void addItem(
    String productId,
    String title,
    double price,
    String image,
    String size,
  ) {
    // 生成商品+规格的唯一key
    final uniqueKey = '$productId|$size';
    if (_items.containsKey(uniqueKey)) {
      _items.update(
        uniqueKey,
        (prevCartItem) => Cart(
          id: prevCartItem.id,
          title: prevCartItem.title,
          image: prevCartItem.image,
          quantity: prevCartItem.quantity + 1,
          price: prevCartItem.price,
          size: prevCartItem.size,
        ),
      );
    } else {
      _items.putIfAbsent(
        uniqueKey,
        () => Cart(
          id: DateTime.now().toString(),
          title: title,
          quantity: 1,
          image: image,
          price: price,
          size: size,
        ),
      );
    }
    notifyListeners();
  }
补充说明

如果你的规格参数后续会扩展多个维度,比如同时区分颜色、尺码、容量,只需要调整uniqueKey的拼接规则即可,例如$productId|$size|$color|$capacity,即可实现多规格维度的单独条目存储。

内容的提问来源于stack exchange,提问作者Anastasia Selezneva

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.13 19:39:03