element中table的列标题自定义

一、需求

工作中要求表格table中的某一列标题为红色如图

element中table的列标题自定义_第1张图片

二、方案一

使用el-table-column自带的:render-header="renderHeader"函数

render-header 列标题 Label 区域渲染使用的 Function Function(h, { column, $index })

 使用有点像v-html插入代码片段,很烦

具体使用可以看这个 el-table 自定义表头label

三、方案二

使用插槽


      
      

自定义表头,自定义表头里面提到使用 Scoped Slot 方法来重置表头

Table-column Scoped Slot

name 说明
自定义列的内容,参数为 { row, column, $index }
header 自定义表头的内容. 参数为 { column, $index }

类似的方法还有很多,比如:表头添加图标类,添加输入框,添加选择框的, 都可以使用这个方法

你可能感兴趣的:(elementui,前端,javascript)