表头插槽使用#header，不能使用slot=“header”

前端开发过程中遇到了UI设计了这样一个界面，并列两排表格，点击左侧行右侧显示该行下的数据信息，勾选左侧内容时右侧内容全部勾选，右侧内容有分页。
这是element-ui的多选表格已经不能满足需求了，并且多选框组el-checkbox-group也不能满足需求
这时需要单独定义左侧的表头checkbox和内容的checkbox

可以使用slot插槽来实现表头和内容的单独控制
表头插槽使用#header，不能使用slot=“header”，因为表头数据如果使用动态变量（v-model、indeterminate），用slot=“header”就不会动态更新。
当使用slot="header"来定义表头时，Vue会将其视为静态内容，即在编译阶段就确定了其内容，不会进行响应式更新。这是因为Vue在编译模板时，会对静态内容进行优化，将其提升为静态的渲染结果，以提高性能。
而使用#header的方式，是Vue的一种特殊语法，它会将表头内容作为一个动态插槽处理。动态插槽会被Vue处理为响应式的内容，当数据变化时，Vue会重新渲染插槽内容，并将其更新到对应的位置上。这样就实现了自动更新。

而使用#header的方式，是Vue的一种特殊语法，它会将表头内容作为一个动态插槽处理，可以实现自动更新。这是因为动态插槽会被Vue处理为响应式的内容，当数据变化时，会自动更新对应的插槽内容。
以上内容引用于https://blog.csdn.net/wuj1935/article/details/132271478

其余插槽使用slot-scope=“scope”

根据具体的状态值修改即可

 indeterminate为false，checkAll为false的时候，状态为未选中。
 indeterminate为true，checkAll为false的时候，状态为半选中。
 indeterminate为false，checkAll为true的时候，状态为全选中。

<el-table
     ref="multipleDatasetTable"
     class="dt_table"
     v-loading="datasetLoading"
     :data="datasetList"
     max-height="500"
     stripe
     highlight-current-row
     @current-change="currentDatasetChange"  
>
       <template slot="empty">
          <el-empty
           :image-size="75"
           :image="require('@/assets/empty.png')"
           description="暂无数据"
           style="padding: 100px 0"
           ></el-empty>
        </template>
        <el-table-column align="center" width="45">
            <template #header>
               <el-checkbox
                 v-model="datasetHeader.checkAll"
                 :indeterminate="datasetHeader.indeterminate"
                 :disabled="datasetList.length==0"
                 @change="datasetHeaderChoose(datasetHeader)"
               />
            </template>
            <template slot-scope="scope">
               <el-checkbox
                 v-model="scope.row.checkAll"
                 :indeterminate="scope.row.indeterminate"
                 @change="datasetChoose(scope.row)"
                />
            </template>
       </el-table-column>
</el-table>