300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > elementui表格中tip设置_VUE2.0+ElementUI2.0表格el-table:表头扩展el-tooltip

elementui表格中tip设置_VUE2.0+ElementUI2.0表格el-table:表头扩展el-tooltip

时间:2020-09-27 11:37:14

相关推荐

elementui表格中tip设置_VUE2.0+ElementUI2.0表格el-table:表头扩展el-tooltip

ElementUI2.0的表格的扩展:

如果要实现鼠标移到表头有注释或者弹框该怎么添加呢?

可以使用table的rander-header属性,render出一个el-tooltip文字提示

而文字提示的内容暂存到label-class-name属性里(当然损失了label-class-name的应有功能)

在el-table-column上添加:rander-header="foo"

然后在methods里写上foo方法:

foo(h,{column}){

if(column. labelClassName){

return(

class="item"

effect="dark"

content={column.lableClassName}

placement="bottom"

>

{column.lable}

)

}

}

注:里边的span是渲染的表头名,因为全部整个都重新渲染了,效果如下图:

微信图片_0330093749.jpg

如果还有其它疑问请留言,谢谢支持~

demo github地址 运行后点击菜单里的“持仓”

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。