element-ui el-table 多选和行内选中

<template>

  <div style="width: 100%;height: 100%;padding-right: 10px">

    <el-table

      ref="multipleTables"

      :data="tableData"

      max-height="300"

      @selection-change="handleSelectionChange"

      @row-click="btn"
　　　　>

      <el-table-column

        type="selection"

        width="55">

      </el-table-column>

      <el-table-column align="center" prop="areaName" label="装置/区域">

      </el-table-column>

      <el-table-column align="center" prop="pointName" label="分析单元/风险点名称">

      </el-table-column>

    </el-table>

  </div>

</template>

<script>

  export default {

    data(){

      return {

        getRowKeys(row) {

          return row.id;

        },

        tableData: []

      }

    },

    methods:{//选中排查内容

      handleSelectionChange(row) {

        console.log(row)

        // this.formObj.hiddenDangerCheckPlanContentList = []

        // row.map((res)=>{

        //   this.formObj.hiddenDangerCheckPlanContentList.push({

        //     areaId:res.areaId,

        //     content:res.content,

        //     judgeBasis:res.basis,

        //     dictId:res.id

        //   })

        // })

      },

      btn(row){

        this.$refs.multipleTables.toggleRowSelection(row)

      },

    }

  };

</script>

<style lang="scss" scoped>

</style>

element-ui el-table 多选和行内选中的相关教程结束。