vue element 表格多选框

@selection-change="handleSelectionChange"多选框被选中时触发
@row-click=“textRowClick” 行点击被触发

<el-table
          :data="textDocList"
          border
          style="width: 100%"
          @selection-change="handleSelectionChange"
          ref="textDocRef"
          @row-click="textRowClick"
          max-height="700"
        >

多选框被选中触发,参数为selection,可获取选中行的数据,数组类型,多选后,会将选中的每行都放进数组里面,数组套数组。可通过selection.length获取选中的行数量从而去做一些判断

// 监控多选框事件
    handleSelectionChange(selection) {
      this.selectNum = selection.length;
      this.selection = selection;
    },

行点击触发,可以在这个方法中调用表格的方法toggleRowSelection实现点击行就选中多选框

textRowClick(row) {
      this.$refs.textDocRef.toggleRowSelection(row);
    },

 

posted @ 2021-01-13 15:11  在学习编程的lsy呀  阅读(1059)  评论(0编辑  收藏  举报