微信小程序纯前端完整购物车实现方法

mycart.js代码

// pages/mycart/mycart.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    goods: [{
        id: 1,
        name: "拼色短袖T恤",
        model: "白色，S",
        price: 22,
        num: 1,
        imgurl: "/image/src/good1.png"
      },
      {
        id: 2,
        name: "拼色短袖T恤",
        model: "黑色，S",
        price: 25,
        num: 1,
        imgurl: "/image/src/good2.png"

      },
      {
        id: 3,
        name: "拼色短袖T恤",
        model: "蓝色，S",
        price: 28,
        num: 1,
        imgurl: "/image/src/good4.png"
      },
      {
        id: 4,
        name: "拼色短袖T恤",
        model: "紫色，S",
        price: 32,
        num: 1,
        imgurl: "/image/src/good6.png"
      }
    ],
    //所有商品的数
    goodscount: 0,
    is_edit: 0,
    //是否全选，s是编辑模式
    is_check_all_s: 0,
    is_check_all_d: 0,
    //结算时被选中的件数
    select_scount: 0,
    money: 0,
    num_input: 1
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    let goods = this.data.goods
    let goodscount = 0
    for (let i = 0; i < goods.length; i++) {
      goodscount += goods[i].num
      //添加一个新的属性默认值为0,这个属性用来判断在编辑模式商品是否被选中
      goods[i].dot_s = 0
      //在非编辑模式下商品是否被选中
      goods[i].dot_d = 0
    }
    this.setData({
      goodscount: goodscount,
      goods: goods
    })
  },
  goshopping_func() {
    wx.navigateTo({
      url: '/pages/shop/shop',
    })
  },
  //改变购物车模式
  change_edit_func() {
    let is_edit = this.data.is_edit
    let goods = this.data.goods
    let is_check_all_s = this.data.is_check_all_s
    let is_check_all_d = this.data.is_check_all_d
    if (is_edit == 1) {
      for (let i = 0; i < goods.length; i++) {
        //添加一个新的属性默认值为0
        goods[i].dot_s = 0
      }
    } else {
      for (let i = 0; i < goods.length; i++) {
        //添加一个新的属性默认值为0
        goods[i].dot_d = 0
      }
    }
    this.setData({
      is_edit: !is_edit,
      goods: goods,
      is_check_all_s: 0,
      is_check_all_d: 0,
      //改变购物车模式时，所有选中商品数清零
      select_scount: 0,
      money: 0
    })
  },
  //商品在俩个模式中被选中时的处理
  select_goods_func(e) {
    let id = e.currentTarget.dataset.id
    let goods = this.data.goods
    let is_edit = this.data.is_edit
    if (is_edit) {
      for (let i = 0; i < goods.length; i++) {
        if (goods[i].id == id) {
          goods[i].dot_s = !goods[i].dot_s
        }
      }
    } else {
      for (let i = 0; i < goods.length; i++) {
        if (goods[i].id == id) {
          goods[i].dot_d = !goods[i].dot_d
        }
      }
      //非编辑模式下统计选中商品数量和总金额
      this.count_money(goods)
    }
    this.setData({
      goods: goods,
    })
  },
  //统计结算金额和结算商品数量
  count_money(goods) {
    let select_s