element表格复选框使用方法及默认选中方法

一、实现多选:
步骤1:
在表格中添加一列
clipboard.png

步骤2:
在data中定义以及数组用来存储选中的元素。例如:multipleSelection:[]

selection-change方法用户实时监听选中元素

clipboard.png
实现效果如下:

element表格复选框使用方法及默认选中方法_第1张图片

二、实现默认选中

在获取表格数据时,添加如下方法,其中me.zclbList为获取到的表格数据列表

clipboard.png

clipboard.png

定义ref="table",用来获取该表格

toggleSelection方法如下:

        toggleSelection(rows) {
            if (rows) {
            rows.forEach(row => {
                //设置该表格选框选中
                this.$refs.table.toggleRowSelection(row);
            });
            } else {
                 athis.$refs.table.clearSelection();
            }
        }

即可实现默认选中。

你可能感兴趣的:(element-ui,vue.js)