elementui 自定义表头 renderHeader的写法 给增加el-tooltip的提示
1.html
<el-table-column prop="taxes" :render-header="renderHeader" width="180">
<template slot-scope="scope">{{scope.row.taxes}}</template>
</el-table-column>
2.js
renderHeader(h, { column, $index }) {
// console.log(column, $index)
// console.log(this.addedValueTaxRate, this.additionalTaxRate)
let addedValueTaxRate = this.addedValueTaxRate //
let additionalTaxRate = this.additionalTaxRate // 0.8
return [
'税费',
h(
'el-tooltip',
{
props: {
content: (function() {
return `含增值说${addedValueTaxRate}%,附加税${additionalTaxRate}%`
})(),
placement: 'top'
}
},
[
h('span', {
class: {
'el-icon-question': true
}
})
]
)
]
}
3.亲测有效,在代码中正在使用
4.效果图

elementui 自定义表头 renderHeader的写法 给增加el-tooltip的提示的更多相关文章
- element-ui自定义table表头,修改列标题样式
elementUI table表格一般的样式是这样的: 但是要改变表头是比较麻烦的一个事情,但是往往有些项目是需要的比如改成如下样式: 一般直接改起来挺麻烦,好在官网提供了一个方法:render-he ...
- ElementUI的Table-column_render-header自定义表头
ElementUI的Table表格,官方网站上提供了很多样式,但是在日常开发中还会碰到各种情况,显然官方提供的是不能满足需求的.那么,我们就根据自己的需求对table进行改造. 先丢出关于Table的 ...
- ElementUI - Table 表头排序
ElementUI - Table 表头自带排序功能,和排序事件,但是目前只是对当前界面的数据进行排序. 项目需求: 点击表头排序的时候,对所有数据进行排序. 初步方案: 在点击排序按钮的时,在排序事 ...
- vue + element ui 表格自定义表头,提供线上demo
前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...
- ElementUI2.0组件库el-table表格组件如何自定义表头?
效果图: npm run dev 编译项目之后,报错,要使用jsx语法需要先安装编译插件 1.安装下列安装包 npm install babel-plugin-syntax-jsx --save-de ...
- element之table自定义表头
1.实现效果 2.使用render-header可以自定义表头 <el-table-column prop="date" label="日期" sorta ...
- Android自定义View 画弧形,文字,并增加动画效果
一个简单的Android自定义View的demo,画弧形,文字,开启一个多线程更新ui界面,在子线程更新ui是不允许的,但是View提供了方法,让我们来了解下吧. 1.封装一个抽象的View类 B ...
- Android中利用ViewHolder优化自定义Adapter的典型写法
利用ViewHolder优化自定义Adapter的典型写法 最近写Adapter写得多了,慢慢就熟悉了. 用ViewHolder,主要是进行一些性能优化,减少一些不必要的重复操作.(WXD同学教我的. ...
- QTableWidget自定义表头QHeaderView加全选复选框
1 QTableWidget自定义表头QHeaderView加全选复选框 在使用QTableWidget时需要在表头添加全选复选框,但是默认的表头无法添加复选框,只能用图片画上去一个复 ...
随机推荐
- echarts-中的事件-- demo1.on('事件类型', function (params) {}
ECharts 支持常规的鼠标事件类型,包括 'click'.'dblclick'.'mousedown'.'mousemove'. 'mouseup'.'mouseover'.'mouseout'. ...
- 使用Visual Studio学习C语言
注明:安装的是社区版,只写大部分步骤,做笔记之用.详细还需要看B站教程,https://www.bilibili.com/video/av59608520 一.安装软件 1.安装Visual Stud ...
- centos用手机号无法登入安全狗的解决方法
前面我们安装好了安全狗,需要加服务器加入服云中,通常用sdcloud –u 用户名就可以,但如果是手机号的话就可能无法登陆,我们用sdcloud -h命令查看帮助,如下图所示 我们看到输入账号可以用- ...
- 10-numpy笔记-np.random.randint
b_idx = np.random.randint(0, 9, 90) >>> b_idx array([0, 1, 5, 4, 7, 2, 7, 0, 0, 4, 2, 2, 3, ...
- 并发、并行、同步、异步、全局解释锁GIL、同步锁Lock、死锁、递归锁、同步对象/条件、信号量、队列、生产者消费者、多进程模块、进程的调用、Process类、
并发:是指系统具有处理多个任务/动作的能力. 并行:是指系统具有同时处理多个任务/动作的能力. 并行是并发的子集. 同步:当进程执行到一个IO(等待外部数据)的时候. 异步:当进程执行到一个IO不等到 ...
- Linux学习笔记-第9天 与windows相同的分区知识
可能是因为之前自己已经对分区.引导.操作系统已经有了足够的认知和实践经验,也可能是因为这个知识已经看了三遍的原因.最近笔记有点少. 不是特别同意老师 新硬盘也可以不分区的关点.默认硬盘不分区应该是不能 ...
- 知识点总结 VUE部分
1.v-show和v-if的区别 v-show 操作的是元素的display属性 v-if 操作的是元素的创建和插入 v-if有更高的开销,而v-show有更高的初始渲染开销,如果需要非常频繁的切换, ...
- [LeetCode] 204. Count Primes 质数的个数
Count the number of prime numbers less than a non-negative number, n. Example: Input: 10 Output: 4 E ...
- KMP 串的模式匹配 (25分)
给定两个由英文字母组成的字符串 String 和 Pattern,要求找到 Pattern 在 String 中第一次出现的位置,并将此位置后的 String 的子串输出.如果找不到,则输出“Not ...
- uniApp配置文件几个注意点
虽然有文档,但是偶尔还是会又找不到的,写下来遇到过的问题,随时补充.好记性不如烂笔头. 1.打包完安装之后,app 有时候会弹出一个提示框.如下: 修改配置项,设置 ignoreVersion 为 t ...