微信小程序中全选与全不选

wxml

<!-- 多选框列表 -->
<checkbox-group class="checkboxList" @change="checkboxChange">
	<label class="uni-list-cell uni-list-cell-pd" v-for="(item,index) in goodsList" :key="index" style="display: flex;align-items: center;padding: 20rpx 0;">		
		<view>
		<!--style="transform: scale(.7);" 可以修改多选框的大小-->
			<checkbox :value="item.value" :checked="item.checked" style="transform: scale(.7);" />
			...
		</view>
	</label>
</checkbox-group>
...
<!--全选按钮-->
<checkbox-group  @change="changeCheckAll">
	<label>
		<checkbox value="checked" :checked="checked" style="transform: scale(.7);" />
			<text>全选</text>
	</label>
</checkbox-group>

js

data(){
	goodsList:[]，
	// 全选按钮的选中状态
	checked:false
}

// 多选框点击事件
checkboxChange: function(e) {
	var items = this.goodsList,
	values = e.detail.value;
	let arr = []
	for (var i = 0, lenI = items.length; i < lenI; ++i) {
		const item = items[i]
		if (values.includes(item.value)) {
			item.checked = true
			arr.push(item)
		}
		// 设置全选按钮的选中状态			
		if(arr.length==items.length){
			this.checked = true
		}else{
			this.checked = false
		}
	}
}，

// 切换是否全选
changeCheckAll(e){
	let items = this.goodsList;
	if(e.detail.value.length==0){
		this.goodsList.map(item => this.$set(item,'checked',false))
		this.checked = false
		}else{
			this.goodsList.map(item => this.$set(item,'checked',true))
			this.checked = true
		}
	}
}，