element-ui自定义table表头
<el-table-column show-overflow-tooltip prop="telephone" label="填写 但不完整" width="100" :render-header="renderHeader">
</el-table-column>
renderHeader(createElement, { column, _self }) {
let label = column.label;
let labelArr = label.split(' ');
return createElement(
'div',
{
'class': 'header-center'
},
[
createElement('div', {
attrs: { type: 'text' },
}, [labelArr[0]]
),
createElement('div', {
attrs: { type: 'text' },
}, [labelArr[1] || '']
)
]
);
},
效果图:

element-ui自定义table表头的更多相关文章
- (Element UI 组件 Table)去除单元格底部的横线
Element UI 组件 Table 有一个属性 border,添加它可以增加纵向边框,但是无法控制横线边框,因此即使是最简单的 el-table,也会包含一个底部横线. 这个底部横线其实是一个 b ...
- element ui设置表格表头高度和每一行的高度
填坑记录:今天用element ui的表格组件做用户信息展示,直接拉取的官网的代码过来,发现表头和每一行都太高了,如下: 因为第一次使用element ui的表格组件,不太清楚会遇到这样的坑,以为能轻 ...
- element ui的table的头部自定义
<el-table-column label="级别" min-width="120" prop="clueLevel" align= ...
- element-ui自定义table表头,修改列标题样式
elementUI table表格一般的样式是这样的: 但是要改变表头是比较麻烦的一个事情,但是往往有些项目是需要的比如改成如下样式: 一般直接改起来挺麻烦,好在官网提供了一个方法:render-he ...
- Element UI的Table用法
Table 表格 用于展示多条结构类似的数据,可对数据进行排序.筛选.对比或其他自定义操作. ¶基础表格 基 2016-05-02 王小虎 上海市普陀区金沙江路 1518 弄 2016-05-04 王 ...
- element-ui自定义table表头,修改标题样式、添加tooltip及 :render-header使用简介
修改列标题样式1.在列标题后面加一个图标. 以element-ui官方文档一个table表格为例,我们在地址的后面加一个定位标志的图标,代码如下: <template> <el-ta ...
- Element Ui中table实现表格编辑效果
主要以css实现 .tb-edit .el-input, .tb-edit .el-input-number, .tb-edit .el-select { display: none; width: ...
- element ui 合计/table show-summary
在el-table 上面加上show-summary就可以对table的数据进行合计 但是上次出现了合计栏有的为空,有的合计不对的情况,如果出现的是空,那么说明你渲染的数据有undefine(即后台返 ...
- element ui 自定义异步验证
之前提到过,axios是一个异步请求,但是很多时候我们都需要同步请求,比如在element的表单验证中需要验证一个用户名是否存在的时候,异步请求好像就不太好用了.前边博客中提到过,这种情况可以用es6 ...
随机推荐
- 锐动SDK针对游戏直播提出的解决方案
方案架构 PC端视频直播与录播功能为游戏厂商宣传,玩家个人秀,大型电竞赛事提供完美的技术解决方案. 直播形式灵活多变不,同音源的选择,画面切换,游戏中嵌入摄像头丰,富解说画面.突出主播个人魅力与粉丝形 ...
- Java语法基础-final关键字
final关键字主要用在三个地方:变量.方法.类. 对于一个final变量,如果是基本数据类型的变量,则其数值一旦在初始化之后便不能更改: 如果是引用类型的变量,则在对其初始化之后便不能再让其指向另一 ...
- axis2与eclipse的整合:开始一个简单的axis2 的demo
1.下载axis2,现在axis2最新版本是axis2-1.6.2,下载地址:http://axis.apache.org/axis2/java/core/download.cgi 2.下载好的zip ...
- 黑马程序员----java基础:多线程
------Java培训.Android培训.iOS培训..Net培训.期待与您交流! ------- ------Java培训.Android培训.iOS培训..Net培训.期待与您交流! ---- ...
- java实现的单点登录
摘要:单点登录(SSO)的技术被越来越广泛地运用到各个领域的软件系统当中.本文从业务的角度分析了单点登录的需求和应用领域:从技术本身的角度分析了单点登录技术的内部机制和实现手段,并且给出Web-SSO ...
- H1B工作签证·绿卡:美国留学的两个关键步骤
月20日在留美学生家长群聚会上的发言稿一.H1B签证系美国最主要的工作签证类别,发放给美国公司雇佣的外国籍有专业技能的员工,属于非移民签证的一种.持有H1B签证者可以在美国工作三年,然后可以再延长三年 ...
- HDU_1856_带权并查集
有10000000个同学,他们之间可能是直接朋友或者间接朋友,问最大的朋友圈有多少人. 一直觉得10000000的数组开不了,用map优化了一下,结果能开,且10000000也不会超时... #inc ...
- sql 语句的优化
sql语句的优化:在大多数情况下,为了更快的遍历表结构,优化器主要是根据定义的索引来提高性能.但是在不合理的SQL语句中,优化器会删去索引进而使用全表扫描, 一般而言,这种sql被称为劣质sql,所以 ...
- 单文件组件.vue---父子组件通信
每一个.vue 文件就是一个 组件,组件和组件相互组合,就成了一个应用,这就涉及到的组件和组件之间的通信,最常用的就是父子之间的通信.在vue 中, 在一个组件中通过 import 引入另一个组件,这 ...
- java线程池 多线程 搜索包含关键字的文件路径
package org.jimmy.searchfile20180807.main; public class ThreadMain implements Runnable{ private int ...