ElementUI表格表头自定义添加checkbox，点击选中样式不生效

ew452182025-02-19 4:07

场景：需要自定义table的多选效果，不用其自带的，采用官方文档此处（如图）的处理过程，并把全选控件嵌入table的表头，el-checkbox在table表头勾选样式不生效。

具体用法，点击全选，样式没有变化

javascript 复制代码

<el-table-column align="center" prop="enable" width="55">
  <template slot="header" >
    <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange"></el-checkbox>
  </template>
  <template slot-scope="scope">
    <el-checkbox v-model="scope.row.enable" true-label="1" false-label="0"
      @change="handleCheckboxChange(scope.row)"></el-checkbox>
  </template>
</el-table-column>

改进方法加入slot-scope="scope"，改进后：

javascript 复制代码

<template slot="header" slot-scope="scope">
  <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange"></el-checkbox>
</template>