在<el-table>标签加 :cell-class-name="cellClass"

在 <el-table-column type="selection">标签加:selectable="selectable" ,如果不加,会出现单元格复选框全部选中,但是表头复选框还是半选状态

<div id="app">
<el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%" :cell-class-name="cellClass">
<el-table-column type="selection" width="55" :selectable="selectable"></el-table-column>>
<el-table-column label="日期" width="120">
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column prop="name" label="姓名" width="120">
</el-table-column>
<el-table-column prop="address" label="地址" show-overflow-tooltip></el-table-column>
</el-table>
</div>
var app = new Vue({
el: '#app',
data: {
tableData: [{
checkStatus: 1,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
checkStatus: 1,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-06',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-07',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}],
multipleSelection: []
},
method: {
        // 彻底隐藏
cellClass({ row, columnIndex }) {
if (row.checkStatus == 1) {
// 根据某个属性,添加样式,隐藏复选框
return "myCell";
}
},
        // 显示,但不可选中
selectable(row, index) {
if (row.checkStatus != 1) {
return true
} else {
return false
}
}
}
})
<style>
.myCell .el-checkbox__input {
display: none !important;
}
</style>

element table根据条件隐藏复选框的更多相关文章

  1. 转:Ext GridPanel根据条件显示复选框

    Ext GridPanel实现复选框选择框: var selectModel = new Ext.grid.CheckboxSelectionModel({ singleSelect : false ...

  2. element表格切入按钮以及复选框

    1,element表格切入按钮 关键代码: html:<el-table :data="tableList" border style="width: 100%&q ...

  3. 关于MUI v0.18.0版本 Table组件里的复选框不能选的解决方案

    前段时间在用MUI的时候,Table组件出现复选框不能选的bug(描述: 点击复选框,点击事件会触发,复选框勾选状态无变化). 解决方法: 用CheckBox组件代替Table组件自带的复选框. 解决 ...

  4. 复选框input:checkbox

      复选框 CreateTime--2017年6月5日14:04:55Author:Marydon 五.复选框 (一)语法 <input type="checkbox" /& ...

  5. 关于通过jq /js 实现验证单选框 复选框是否都有被选中

    今天项目中遇到一个问题 就是要实现,单选框,复选框 同时都被选中才能进行下一步的问题,开始用js原生来写 怎么写都觉得不合适,通过for循环得出 复选框被选中的,在通过for循环得出单选框被选中的,问 ...

  6. ListBox复选框拓展

    Toolkit的LongListMutiSelector的复选框功能,想必许多人都需要吧!然而系统本身控件ListBox虽然也有多选功能,可是外观上却缺乏复选框,选择效果只是颜色变化.于是在上一个项目 ...

  7. 使用CSS3制作酷炫防苹果复选框 自行测试!

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. jquery怎样获取多个复选框的值?

    jquery的遍历方法可以获取复选框所欲的选中值 1 2 $("input:checkbox:checked").each(function(index,element));    ...

  9. js根据选中的复选框,隐藏那一行

    如图,选择复选框,点击“隐藏”按钮,隐藏选中行 1.JavaScript代码: function getCheckedIds() { var checkedSubject = $('#showSbgl ...

  10. spring mvc:常用标签库(文本框,密码框,文本域,复选框,单选按钮,下拉框隐藏于,上传文件等)

    在jsp页面需要引入:<%@taglib uri="http://www.springframework.org/tags/form" prefix="form&q ...

随机推荐

  1. 多年锤炼,迈向Kata 3.0 !走进开箱即用的安全容器体验之旅| 龙蜥技术

    简介: 袋鼠与 Kata 将会碰撞出什么样的火花? 文/云原生 SIG(Special Interest Group) 一.Kata 的过去 让我们将时钟拨回 2015 年 5 月,Hyper.sh ...

  2. 基于 EMR OLAP 的开源实时数仓解决方案之 ClickHouse 事务实现

    ​简介:阿里云 EMR OLAP 与 Flink 团队深度合作,支持了 Flink 到 ClickHouse 的 Exactly-Once写入来保证整个实时数仓数据的准确性.本文介绍了基于 EMR O ...

  3. 2019-11-29-如何入门-C++-AMP-教程

    title author date CreateTime categories 如何入门 C++ AMP 教程 lindexi 2019-11-29 08:20:37 +0800 2018-2-13 ...

  4. Arrays类的常用方法

    Arrays类的常用方法 Array数组的工具类java.util.Arrays Arrays类中的方法都是static修饰的静态方法,在使用的时候可以直接使用类名进行调用,而不用使用对象来调用 Ar ...

  5. C#实现图片转Base64字符串.并支持markdown文件打开展示

    引用1.0.3版本或以上的Wesky.Net.OpenTools 包 1.0.3 版本提供图片转Base64字符串方案,并提供根据后缀名自动识别Mime类型,合成标准URI 开源项目地址: Gitee ...

  6. 数据库—安全性控制DCL

    文章目录 授予数据库权限 授予用户能够授予其他用户的权限 收回权限 数据库的权限(特殊) 授予数据库权限 这里的用户是指数据库DBMS中创建的用户,而不是程序中的账户用户. 授予某个/多个表的某一个/ ...

  7. 数据库—SQL语言学习

    文章目录 SQL 数据类型 重要的关键字 定义数据库 数据库的文件 table创建与删除 表的定义 表的alter 表的删除 视图 定义视图 删除视图 更新视图 插入视图 视图总结 索引 SQL单表查 ...

  8. C 语言编程 — 高级数据类型 — 字符串

    目录 文章目录 目录 前文列表 字符串 前文列表 <程序编译流程与 GCC 编译器> <C 语言编程 - 基本语法> <C 语言编程 - 基本数据类型> <C ...

  9. typora不支持mermaid 问题记录

    typora不支持mermaid 问题记录 注意: 使用不了最新版本js,目前我测的最高版本9.3,有些复杂的图表不能用,不过已经满足我使用的需求了.知足了 本文只做记录,如有问题请联系删除!!!感谢 ...

  10. 如何使用Python和Plotly绘制3D图形

    本文分享自华为云社区<Plotly绘制3D图形> ,作者:柠檬味拥抱. 在数据可视化领域,三维图形是一种强大的工具,可以展示数据之间的复杂关系和结构.Python语言拥有丰富的数据可视化库 ...