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的提示的更多相关文章

  1. element-ui自定义table表头,修改列标题样式

    elementUI table表格一般的样式是这样的: 但是要改变表头是比较麻烦的一个事情,但是往往有些项目是需要的比如改成如下样式: 一般直接改起来挺麻烦,好在官网提供了一个方法:render-he ...

  2. ElementUI的Table-column_render-header自定义表头

    ElementUI的Table表格,官方网站上提供了很多样式,但是在日常开发中还会碰到各种情况,显然官方提供的是不能满足需求的.那么,我们就根据自己的需求对table进行改造. 先丢出关于Table的 ...

  3. ElementUI - Table 表头排序

    ElementUI - Table 表头自带排序功能,和排序事件,但是目前只是对当前界面的数据进行排序. 项目需求: 点击表头排序的时候,对所有数据进行排序. 初步方案: 在点击排序按钮的时,在排序事 ...

  4. vue + element ui 表格自定义表头,提供线上demo

    前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...

  5. ElementUI2.0组件库el-table表格组件如何自定义表头?

    效果图: npm run dev 编译项目之后,报错,要使用jsx语法需要先安装编译插件 1.安装下列安装包 npm install babel-plugin-syntax-jsx --save-de ...

  6. element之table自定义表头

    1.实现效果 2.使用render-header可以自定义表头 <el-table-column prop="date" label="日期" sorta ...

  7. Android自定义View 画弧形,文字,并增加动画效果

    一个简单的Android自定义View的demo,画弧形,文字,开启一个多线程更新ui界面,在子线程更新ui是不允许的,但是View提供了方法,让我们来了解下吧. 1.封装一个抽象的View类   B ...

  8. Android中利用ViewHolder优化自定义Adapter的典型写法

    利用ViewHolder优化自定义Adapter的典型写法 最近写Adapter写得多了,慢慢就熟悉了. 用ViewHolder,主要是进行一些性能优化,减少一些不必要的重复操作.(WXD同学教我的. ...

  9. QTableWidget自定义表头QHeaderView加全选复选框

    1         QTableWidget自定义表头QHeaderView加全选复选框 在使用QTableWidget时需要在表头添加全选复选框,但是默认的表头无法添加复选框,只能用图片画上去一个复 ...

随机推荐

  1. echarts-带面积的折线图

    测试地址 https://gallery.echartsjs.com/editor.html?c=x6p5SsIEzt var listN = '高温'; var unit = '°C'; //单位 ...

  2. 2019 China Collegiate Programming Contest Qinhuangdao Onsite

    传送门 D - Decimal 题意: 询问\(\frac{1}{n}\)是否为有限小数. 思路: 拆质因子,看是不是只包含2和5即可,否则除不尽. Code #include <bits/st ...

  3. PDFium-PDF开源之旅

    1.安装python 2.7 https://blog.csdn.net/lzfly/article/details/27077487 https://www.jianshu.com/p/8bb348 ...

  4. 10-tensorflow-tf.concat()

    Concatenates tensors along one dimension. t1 = [[1, 2, 3], [4, 5, 6]] t2 = [[7, 8, 9], [10, 11, 12]] ...

  5. vue系列---Vue组件化的实现原理(八)

    _ 阅读目录 一. 什么是Vue组件? 如何注册组件? 1.1 全局注册组件 1.2 局部注册组件 二:组件之间数据如何传递的呢? 1) props 2) $emit 3) 使用$ref实现通信 4) ...

  6. 前端css命名规范----BEM

    一.什么是BEM BEM就是块(block).元素(element).修饰符(modifier),是由Yandex团队提出的一种前端命名方法论.这种巧妙的命名方法可以使css类对其他开发者来说更加透明 ...

  7. 8.10 NOIP模拟测试16 Blue+Weed+Drink

    T1 Blue 贪心,每次跳得时候跳能跳到的最远的地方,跳过的就把他设为0,每次二分找到位置,一直跳就行,如果能跳到的位置就是当前位置或比当前位置还小(数组里现在呆着的这一块石头,二分得到的就是当前位 ...

  8. [LeetCode] 38. Count and Say 计数和读法

    The count-and-say sequence is the sequence of integers with the first five terms as following: 1. 1 ...

  9. 端口转发之 lcx

    lcx.exe是一个端口转发工具,有Windows版和Linux版两个版本,Windows版是lcx.exe,Linux版为portmap Windows版使用方法如下: lcx有两大功能: )端口转 ...

  10. 搭建Jena Fuseki并执行SPARQL查询

    1. 下载Jena Fuseki:http://jena.apache.org/download/index.cgi 2. 运行服务 windows解压后双击fuseki-server.bat lin ...