vue element-ui checkbox table 实

2019-11-26  本文已影响0人  一碗米粉的故事

<template slot-scope="scope" slot="header">
<el-checkbox
:indeterminate="isIndeterminate"
v-model="checkAll" @change="handleCheckAllChange">
</el-checkbox>
</template>
<template slot-scope="scope">
<el-checkbox-group v-model="checkedArrIds" @change="handleCheckedIdsChange">
<el-checkbox :checked="scope.row.relStatusCurProject===1" :label="scope.row.eleCode"></el-checkbox>

</el-checkbox-group>
</template>

checkAll: false,
isIndeterminate: false,
checkedArrIds: [],
multipleSelection: [],
checkedIds: [],

handleCheckAllChange(val) {
this.checkedArrIds = val ? this.checkedIds : []
this.isIndeterminate = false
console.log(val)
console.log(this.isIndeterminate)
console.log(this.checkedArrIds)
console.log('checkedArrIds')
},
handleCheckedIdsChange(value) {
console.log(value)
console.log('valueeeeee')
const checkedCount = value.length
this.checkAll = checkedCount === this.checkedIds.length
this.isIndeterminate = checkedCount > 0 && checkedCount < this.checkedIds.length
console.log(value)
console.log(value.length)
console.log(this.isIndeterminate)
console.log('value')
},

   this.tableData = rs
          for (let i = 0; i < this.tableData.length; i++) {
            this.checkedIds.push(this.tableData[i].id)
            this.multipleSelection = this.checkedIds
          }
上一篇 下一篇

猜你喜欢

热点阅读