企业网站建设东莞化妆品设计网站

实现一个微信小程序购物车页面，包含以下功能：

需求说明：

商品列表：显示商品名称、价格、数量加减按钮，支持修改商品数量（数量≥1）。

全选 / 反选功能：顶部 “全选” 复选框，点击后切换所有商品的选中状态。

计算总价：仅计算选中商品的总价，显示在页面底部。

删除功能：点击 “删除选中商品” 按钮，删除所有选中的商品。

数据持久化：商品数据和选中状态存储在本地缓存中，页面加载时自动读取。

数据结构参考：

// 商品数据示例

const goodsList = [

  { id: 1, name: '牛奶', price: 5, count: 1, selected: false },

  { id: 2, name: '面包', price: 8, count: 2, selected: true }

];

实现要求：

页面布局：

顶部：全选复选框（checkbox）和 “全选” 文字。

中间：商品列表，使用wx:for循环渲染，每个商品包含：

复选框（绑定selected状态）。

商品名称和价格。

数量加减按钮（+和-，绑定事件处理函数）。

底部：显示总价（格式：“总价：￥XX.XX”）和 “删除选中商品” 按钮。

功能逻辑：

数量修改：点击 “+” 增加数量（无上限），点击 “-” 减少数量，数量为 1 时禁用 “-” 按钮。

全选功能：全选框选中时，所有商品selected设为true；取消选中时设为false，并更新缓存。

总价计算：遍历选中商品，计算price * count之和，实时更新视图。

删除功能：过滤掉选中的商品，更新列表和缓存。

商品图片展示：每个商品增加图片显示（图片路径自定义）。

结算功能：添加 “去结算” 按钮，跳转至结算页面，传递选中商品数据。

样图 

无需云开发