Element UI 多级表头样式修改

编程入门 行业动态 更新时间:2024-10-28 21:18:10

Element UI 多级<a href=https://www.elefans.com/category/jswz/34/1762281.html style=表头样式修改"/>

Element UI 多级表头样式修改

背景是这样 在我使用elementUI的多级表头的时候,需要给表头首列的样式修改了border-radius

实现圆角边,但是后来发现后面的二级表头第一列的样式也会跟着更改

解决办法:通过 Table Attributes 里的 header-cell-style 例如

<el-table :header-cell-style="headerCellStyleFun">

此中 headerCellStyleFun是自定义的一个方法,用来返回自定义样式

然后这个方法里面可以看到我们表头里面的各个column对象

headerCellStyleFun(rowObj) {if (rowObj.rowIndex === 1 && rowObj.columnIndex === 0) {return 'border-radius: 0'}
}

 意思就是表头中第二行里的第一列的单元格 把圆角的样式覆盖掉,这样就ok了

更多推荐

Element UI 多级表头样式修改

本文发布于:2023-11-15 01:36:08,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1591380.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:表头   样式   Element   UI

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!