admin 管理员组

文章数量: 1184232


2024年4月18日发(作者：jsp javabean 实例)

elementui table单元格样式

一、表格单元格样式

ElTable以行为单位，行中的单元格有以下样式控制:

： 指定某一行的某个单元格占据几行几列，即跨行跨列，

默认值为1

：单元格水平对齐，默认值为‘left’，可选值为‘left’,

‘center’, ‘right’

Align：表头单元格水平对齐，默认值为‘left’，可选

值为‘left’, ‘center’, ‘right’

-overflow-tooltip：当内容过长被隐藏时显示tooltip，

默认值为true

-name：单元格的自定义类名

-class-name：表头单元格的自定义类名

-width：单元格最小宽度

示例代码：

:data='tableData'

border

style='width: 100%'>

prop='date'

label='日期'

- 1 -

width='180'

:span='2'

:align=''center''

:header-align=''center''

:show-overflow-tooltip='false'

:class-name=''test-class-name''

:label-class-name=''test-label-class-name''

:min-width='100'

>

二、单元格渲染

ElTable单元格可以使用render渲染的方式实现自定义渲染功

能，render渲染函数会接受三个参数(h, { row, column, rowIndex,

columnIndex })，分别代表createElement函数，当前行所对应的数

据对象，当前列对象，当前行索引，当前列索引。

- 2 -


本文标签： 函数 渲染 表头 样式 对象

版权声明：本文标题：elementui table单元格样式 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/p/1713395069a632442.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。