When the element table has child selection, select the associated child, use checkbox to check the parent child, and use the built-in select-alll to select all and cancel all selections.

sheet

Note: This is added <el-table-column type="selection" align="center" class="selection" :reserve-selection="true" width="55"></el-table-column>here to realize the selection box, this <el-table-column label="" width="55"></el-table-column>is added here to place the check, and this <el-table-column label="" width="55"> <template slot-scope="scope"> <el-checkbox class="my-checkbox" v-model="scope.row.checked" label="" :indeterminate="false" @change="selectChange(scope.row)"></el-checkbox> </template> </el-table-column>is added here to realize the parent checking the child.

<el-table
        ref="multipleTable"
				class="myTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        :default-sort="{ prop: 'date', order: 'descending' }"
        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
        v-loading="loading"
        :row-key="getRowKey"
				@select-all="selectAllChange"
        @selection-change="handleSelectionChange"
      >
      <el-table-column type="selection" align="center" class="selection" :reserve-selection="true" width="55">
		</el-table-column>
      <el-table-column label=""  width="55"></el-table-column>
		<el-table-column label=""  width="55">
			<template slot-scope="scope">
				<el-checkbox class="my-checkbox" v-model="scope.row.checked" label="" :indeterminate="false" @change="selectChange(scope.row)"></el-checkbox>
			</template>
		</el-table-column>
		<el-table-column label="name" prop="name">
		</el-table-column>
		</el-table>        

Implementation

export default {
   data() {
      return {
        loading:false,
        multipleSelection:[],
        tableData:[
					{
					id:1,name:'1',children:[
						{id:11,name:'11'},
						{id:12,name:'12'},
						{id:13,name:'13'},
					]
					},
					{
					id:2,name:'2',children:[
						{id:21,name:'21'},
						{id:22,name:'22'},
						{id:23,name:'23'},
					]
					},
				]
      }
   },
   mounted(){
    //  如果没有checked属性，可以认为加上
		 this.tableData.forEach(item=>{
			 this.$set(item,'checked',false)
		 })
   },
   computed:{
   },
   methods:{
    //  单个父级勾选
		selectChange(row){
      const checked = row.checked
      // 获取选中的数据
      this.handelSize(row)
      // console.log(row,checked,row.hasOwnProperty('children'))
      // 是否有子级
      if(row.hasOwnProperty('children')){
        this.handelChildren(row.children,checked)
      }
      console.log('multipleSelection',this.multipleSelection)
    },
    // 处理子级勾选
		handelChildren(children,checked){
			children.forEach(item=>{
        this.$set(item,'checked',checked)
        // 获取选中的数据
        this.handelSize(item)
        if(item.hasOwnProperty('children')){
        this.handelChildren(item.children,checked)
        }
		 	})
		},
   //  用于树形表格多选, 选中所有 selection
   selectAllChange(selection) {
		//  console.log('selection',selection)
		 // 如果选中的数目与请求到的数目相同就选中子节点，否则就清空选中
     if (selection && selection.length === this.tableData.length) {
       selection.forEach(item=>{
          this.$set(item,'checked',true)
          this.handelSize(item)
          this.selectChange(item)
       })
     } else {
      this.tableData.forEach(item=>{
        this.$set(item,'checked',false)
        this.selectChange(item)
      })
			this.$refs.multipleTable.clearSelection()
     }
   },
  //  获取选中的数据
   handelSize(data){
     // 是勾选就加入数据，不是如果存在就删除
    if(data.checked){
      const idx = this.multipleSelection.findIndex(v=>v.id==data.id)
      // 不存在才添加进去
      if(idx <= -1){
        this.multipleSelection.push(data)
      }
    }else{
      const idx = this.multipleSelection.findIndex(v=>v.id==data.id)
      if(idx >-1){
        this.multipleSelection.splice(idx,1)
      }
    }
   },
   // 选择改变
   handleSelectionChange(val) {
    //  this.multipleSelection = val
		 console.log('multipleSelection',this.multipleSelection)
   },
   //选择分页
   getRowKey(row) {
     return row.id
   },
  },
}

Finally, you need to leave the unnecessary ones below for the parent to check the placeholder style. The left and top here can be adjusted according to the actual situation. It just looks like they are aligned.

<style lang="scss" scoped>
.myTable{
	/deep/ .el-table__body-wrapper {
		.el-table-column--selection .cell{
			display: none;
		}
	}
  /deep/ .my-checkbox {
    position: absolute;
    left: -88px;
    top: 24%;
  }
}
</style>