首页 > 其他 > 详细

vue checkbox 全选操作

时间:2021-07-20 23:24:53      阅读:7      评论:0      收藏:0      [点我收藏+]

<el-form-item label="材料清单"> <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="**handleCheckAllChange**">全选</el-checkbox> <div style="margin: 15px 0;"></div> <el-checkbox-group v-model="addProForm.appFiles" @change="handleCheckedFilesChange"> <el-checkbox name="appFiles" v-for="file in selectFiles()" :label="file" :key="file">{{file}}</el-checkbox> </el-checkbox-group> </el-form-item>

handleCheckAllChange(val) { this.addProForm.appFiles = val ? this.selectFiles() : []; this.isIndeterminate = false;**** }, handleCheckedFilesChange(value) { let checkedCount = value.length; this.checkAll = checkedCount === this.selectFiles().length; this.isIndeterminate = checkedCount > 0 && checkedCount < this.selectFiles().length; }, handleCheckAllChange(val)方法中的this.addProForm.appFiles必须与v-model="addProForm.appFiles"保持一致
this.selectFiles()与v-for="file in selectFiles()"保持一致

vue checkbox 全选操作

原文:https://www.cnblogs.com/yuruixue/p/15037051.html

(0)
(0)
   
举报
评论 一句话评论(0
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!