uni-app中checkbox-group实现全选功能

VIP文章世俗ゝ

已于 2023-02-23 16:56:01 修改

阅读量1.8k

点赞数 2

分类专栏： uniapp vue js 文章标签： uni-app javascript 前端框架

于 2023-02-23 16:50:58 首次发布

本文链接：https://blog.csdn.net/wangongchao/article/details/129184913

版权

功能描述：
点击全选框，选项全被选中，再次点击，选项全不被选中
点击全选，选项全被选中
再次点击，选项全不被选中
在这里插入图片描述

全选框选中状态下，取消任一选项，全选框不被选中，并且在全选框不被选中的状态下，如果选项全都被选择，全选框会变为选中状态全选状态下
取消任一选项，全选框不被选中
在这里插入图片描述

<template>
	<view class="container">
		<!-- 全选 -->
		<checkbox-group name="allCheck" @change="changeAll">
			<label>
				<checkbox :value="allCheck.value" :checked="allCheck.checked"/><text>{
  {allCheck.name}}</text>
			</label>
		</checkbox-group>
		<!-- 每项选择 -->
		<checkbox-group nam