在el-table中添加一列,type设置为selection,实现全选功能
<el-table-column type="selection"></el-table-column>
之前看了官网的方式element组件文档
但是并不完善,因为如果在全选状态下,随意改变一行或多行为不选中,这时再次点击全选checkbox,会发现,他只会在已选中和未选中的行之间切换,并没有全选,因此自己组合了一个。具体可以去动手看看
通过checkbox来控制实现全选
<!-- `checked` 为 true 或 false -->
<el-checkbox v-model="isIndeterminate" //model来控制当前checkbox的状态
@change="toSlctAll(isIndeterminate)">全选</el-checkbox>
//参数修改全选状态。isIndeterminate为true则全选,否则没有全选
全选函数
toSlctAll () {
this.$refs.multipleTable.toggleAllSelection()//全选
},
3、为了让checkbox灵活的自动调整,需要为el-table 添加
@selection-change=“handleSelectionChange”