uni-app购物车全选

uni-app做购物车的全选和选中, 进行判断, 首先要用到es6的every方法, 详细请看(ES6 数组的扩展 - ES6文档), every的好处就是, 根据遍历数组如果条件全部满足则返回true, 否则返回false, 这个用来做子类的选中和全选的选中紧紧相连, 话不多说, 上代码

子类的选中和控制全选

      
// 点击值为false

		if (value.goods_state == 2) {

				// if(state.count < 1) return

				state.sum -= value.goods_price * value.goods_num // 总价

				state.count -= +value.goods_num // 取消减去

				value.goods_state = 1 // 1为false 2 为 true

				state.allChecked = false // 点击任何一个多选框  直接全选为false

		} else {

				state.count += +value.goods_num // 添加加量

				value.goods_state = 2

				state.sum += value.goods_price * value.goods_num // 值为true+去

				const carList = state.shopList.every(item => {

					return item.goods_state === 2

				})

              // 如果条件为真
			  if (carList) {

					state.allChecked = true // 全选按钮为true

			  } else {

					state.allChecked = false // 全选按钮为false

			}

		}

全选控制子类的checked

state.allChecked = !state.allChecked // 取反

			// 如果全选为true

			if (state.allChecked) {

				state.sum = 0

				state.count = 0

				state.shopList.forEach(item => {

					item.goods_state = 2

					// 全选则相加

					state.sum += item.goods_price * item.goods_num

					state.count += +item.goods_num

				})

				console.log(state.sum, state.count);

			} else {

				// 如果全不选则数量0总价0

				state.count = 0

				state.sum = 0

				state.shopList.map(item => {

					item.goods_state = 1

				})

            }

效果图