Flutter中如何实现点击收藏按钮将商品添加到购物车？

• 首先在商品列表的上层状态类里定义购物车数组，用来存储加购的商品数据，小项目直接用setState刷新即可，复杂项目可以搭配Provider、Riverpod等状态管理工具实现跨页面数据共享。

// 购物车存储数组，放在可触发状态更新的父组件中
List<Map<String, dynamic>> cartItems = [];

• 封装加购公共方法，自带重复校验逻辑，避免同个商品重复加入：

void handleAddToCart(Map<String, dynamic> product) {
  // 以商品id为唯一标识判断是否已加购
  final hasProduct = cartItems.any((item) => item['productId'] == product['productId']);
  if (hasProduct) {
    // 重复加购时弹出轻量提示
    ScaffoldMessenger.of(context).showSnackBar(
      const SnackBar(duration: Duration(seconds: 1), content: Text('商品已在购物车内'))
    );
    return;
  }
  setState(() {
    // 新增默认购买数量字段，方便后续购物车页做数量调整
    cartItems.add({
      ...product,
      'buyNum': 1,
    });
  });
  ScaffoldMessenger.of(context).showSnackBar(
    const SnackBar(duration: Duration(seconds: 1), content: Text('已加入购物车'))
  );
}

• 给已经写好的收藏按钮绑定点击回调，一定要把列表渲染时当前项的商品Map传入方法，不要脱离商品遍历上下文单独写按钮逻辑，不然会拿不到对应商品数据：

// 商品列表项内的收藏按钮代码示例
GestureDetector(
  onTap: () => handleAddToCart(currentProduct), // currentProduct是当前列表项遍历到的商品Map
  child: Icon(
    Icons.favorite,
    // 同步根据加购状态切换按钮样式，对齐交互效果
    color: cartItems.any((item) => item['productId'] == currentProduct['productId']) 
      ? Colors.redAccent 
      : Colors.grey[350],
    size: 22,
  ),
)

• 购物车页面直接遍历cartItems数组渲染列表即可，后续做数量增减、全选、总价计算都直接操作这个数组，触发状态更新后商品页按钮状态、购物车页数据会自动同步。

总价计算可以直接用内置方法快速实现，不用手动写循环：

double totalAmount = cartItems.fold(0.0, (prev, curr) => prev + curr['price'] * curr['buyNum']);

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