在<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. 怀里橘猫柴犬,掌上代码江湖——对话阿里云 MVP郭旭东

    简介: 跟郭旭东聊过之后,我对程序员的敬佩又多一分.这个92年的开发者,难能可贵地兼备朝气蓬勃的技术能量与长远深刻的行业洞见.独自承担DevOps平台从0到1的所有工作,我打趣说超级开发者不过如此,他 ...

  2. [FAQ][Hardhat] Error HH501: Couldn't download compiler version 0.8.0. Please check your connection.

    当使用 npx hardhat compile 命令编译智能合约时,会先下载你在 hardhat.config.js 配置中对应版本的 solidity 编译器. 当网络不可达时,就会提示无法下载的错 ...

  3. WPF 通过 Windows Template Studio 快速搭建项目框架和上手项目

    本文对新手友好.在咱开始一个新项目的时候,可以利用 Windows Template Studio 快速搭建整个项目的框架.搭建出来的框架比较现代化,适合想要快速开发一个项目的大佬使用,也适合小白入门 ...

  4. clickhouse数据操常见执行语句

    1.清空本地表数据 truncate table 数据库名.表名 :) select * from test_local; SELECT * FROM test_local Query id: ab1 ...

  5. SpringMVC学习二(日期参数/数据保存/重定向)

    接受的参数为日期类型 controller进行数据保存 Controller如何进行重定向跳转 1.对于前端页面传来日期类型的数据时如何进行处理,有两种方法 1.1在对应的Controller中插入代 ...

  6. linux-centos7.6-gpt-uefi安装

    目录 linux-centos7.6-gpt-uefi安装 一.需要 二.环境 三.vm新建虚拟机系统环境 四.开始安装 linux-centos7.6-gpt-uefi安装 一.需要 安装的系统适用 ...

  7. keepalived(1)- keepalived集群概述

    目录 1. 高可用集群概述 2. keepalived概述 2.1 keepalived介绍 2.2 keepalived体系架构 2.3 keepalived实现原理 2.4 keepalived配 ...

  8. flask注册功能

    一个项目的简单结构划分 首先创建一个新项目 可以正常运行与访问 创建配置文件并添加配置. 将这里拆分到不同的文件中,让启动文件更加简洁. 创建一个apps包,导入配置模块,导入Flask,定义创建ap ...

  9. yum install --downloadonly

    yum install --downloadonly --downloaddir=[directory] [package] https://www.cnblogs.com/wangbaobao/p/ ...

  10. 鸿蒙HarmonyOS实战-Stage模型(卡片数据交互)

    一.卡片数据交互 HarmonyOS卡片数据交互是指在基于鸿蒙操作系统的设备上,卡片界面之间进行数据的传输和交互. HarmonyOS的卡片是一种轻量级的应用界面,可以在设备的屏幕上显示信息和提供操作 ...