美文网首页
vue element-ui checkbox table 实

vue element-ui checkbox table 实

作者: 一碗米粉的故事 | 来源:发表于2019-11-26 22:10 被阅读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
              }

    相关文章

      网友评论

          本文标题:vue element-ui checkbox table 实

          本文链接:https://www.haomeiwen.com/subject/iabywctx.html