element表格點擊行即選中該行復選框

關鍵代碼如下

<el-table ref="multipleTable" :data="tableData" highlight-current-row tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange" @row-click="handleRowClick">
</el-table>

<script>
  export default {
    methods: {
      //點擊複選框觸發,複選框樣式的改變
      handleSelectionChange(val) {
        this.multipleSelection = val;
      },
      //點擊行觸發,選中或不選中複選框
      handleRowClick(row, column, event){
          this.$refs.multipleTable.toggleRowSelection(row);
      }
    }
  }      
</script>

效果圖如下所示
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章