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

场景:需要自定义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>
相关推荐
小雨下雨的雨9 小时前
井字棋AI机器人实现详解 - Minimax算法实战-鸿蒙PC Electron框架完成
前端·人工智能·算法·华为·electron·鸿蒙
ZC跨境爬虫13 小时前
跟着 MDN 学JavaScript day_7:数学运算与逻辑判断实战测试
开发语言·前端·javascript·学习·ecmascript
fangdengfu12313 小时前
ES分析系统各个服务日志占用量
java·前端·elasticsearch
凌云拓界13 小时前
文件管理:让AI安全操作你的电脑 ——CogitoAgent开发实战(三)
javascript·人工智能·架构·开源·node.js
凌云拓界14 小时前
联网能力:让AI看见更广阔的世界 ——CogitoAgent开发实战(四)
javascript·人工智能·架构·node.js·创业创新
JustHappy15 小时前
古法编程秘籍(六):程序到底是怎么跑起来的?从 IO 到中断,一次讲明白
前端·后端·全栈
HYCS15 小时前
用pixi.js实现fabric.js(六):从线性代数的角度理解编辑器交互
前端·javascript·canvas
卷帘依旧15 小时前
useImperativeHandle的作用
前端
卷帘依旧15 小时前
Hooks在Fiber上的存储原理
前端