elementUI创建全选

时间：2021-07-28 18:21:20 阅读：31 评论：0 收藏：0 [点我收藏+]

代码实现

<div class="ik-title">
    <el-checkbox
       :indeterminate="isIndeterminate"
       v-model="checkAll"
       @change="checkAllChange"
    >全选</el-checkbox>
</div>
<div style="width:auto;padding-left:20px;text-align:left;margin-bottom:50px;">
   <el-checkbox-group v-model="checkList">
       <el-checkbox 
　　　　　　v-for="(item,index) in houseSetArr" 
　　　　　　:label="item.label" 
　　　　　　:key="index" 
　　　　　　style="margin-bottom:10px"
　　　　>{{item.label}}</el-checkbox>
   </el-checkbox-group>
</div>


<script>

　　export default {

data() {

return {

checkAll: false,

isIndex: true,

allElection: [],

selectionArr: [],

　　　　　　 checkList: [],

　　　　　　　houseSetArr:[

　　　　　　　｛label:‘测试1‘,id:0｝,

　　　　　　｛label:‘测试2‘,id:1｝,

　　　　　　｛label:‘测试3‘,id:2｝,

　　　　　　｛label:‘测试4‘,id:3｝,

　　　　　　　｛label:‘测试5‘,id:4｝,

　　　　　　　]　　　　　

　　　　 }

methods: {

checkAllChange(val) { // 点击全选

this.allElectionFun();

this.checkList = val ? this.allElection : [];

this.isIndex = false;

this.selectionFun(this.checkList);

//console.log(this.selectionArr)

allElectionFun() { // 获取需要默认显示的数据

this.allElection = [];

for (var i = 0; i < this.houseSetArr.length; i++) {

this.allElection.push(this.houseSetArr[i].label)

}

selectionFun(selectionArr) { // 获取选中的对象

this.selectionArr = [];

for (var i = 0; i < this.houseSetArr.length; i++) {

for (var j = 0; j < selectionArr.length; j++) {

if (selectionArr[j] === this.houseSetArr[i].label) {

this.selectionArr.push(this.houseSetArr[i])

}


</script>

elementUI创建全选

原文：https://www.cnblogs.com/rouyhx/p/15070318.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)