element-ui 自定义表头label(利用 :slot=“header“ slot-scope=“slot“)

复制代码
 <el-table :data="Gbtable" border style="width: 100%">
            <el-table-column prop=" date" label="责任方" align="center" >
            </el-table-column>
            <el-table-column prop="name" label="柜名" align="center">
            </el-table-column>
            <el-table-column prop="address" align="center">
              <template slot="header" slot-scope="slot">
                <span class="gbRed">*产品名称</span><br />
                <span class="gbMiniBlack">板件输条码/五金输名称</span>
              </template>
              <template slot-scope="scope">
                <div>
                </div>
              </template>
            </el-table-column>
 <el-table-column prop="name" label="材质" align="center">
            </el-table-column>
      </el-table>

效果如下:

重点看这:

复制代码
      <el-table-column prop="address" align="center">
//重点
              <template slot="header" slot-scope="slot">
                <span class="gbRed">*产品名称</span><br />
                <span class="gbMiniBlack">板件输条码/五金输名称</span>
              </template>
//
              <template slot-scope="scope">
                <div>
                </div>
              </template>
            </el-table-column>
相关推荐
默_笙6 小时前
🚲 从写信到打电话:WebSocket 双工通信与跨域方案的"通信进化史"
前端·javascript
ikoala7 小时前
DeepSeek 官方仓库惊现 DeepSeek Harness 桌面端!
前端·javascript·后端
liangshanbo12157 小时前
React useEffect 与 useLayoutEffect 面试题整理
前端·javascript·react.js
Bs_MoneyMagnet8 小时前
基于springboot+vue的旅游景区点评系统的设计与实现 源码+文档
java·vue.js·spring boot·后端·spring·旅游
ID34610744208 小时前
【课程设计】基于Spring Boot+Vue的校园共享无人机服务系统设计与实现-计算机毕设 附源码44219
javascript·vue.js·spring boot·python·node.js·php·课程设计
夜不会漫长8 小时前
C++:类和对象(2)
java·javascript·c++
BillKu8 小时前
Vue3 可拖拽分栏布局:两种实现方式详解
javascript·vue.js·ecmascript
雪芽蓝域zzs9 小时前
第三十七节:防抖、节流封装(composables 通用函数,搜索框防重复请求)
前端·javascript·vue.js
十年一梦惊觉醒10 小时前
快手视频发布助手,全自动视频发布带货工具
开发语言·前端·javascript
超人气王10 小时前
细说agent心跳机制--agentLoop循环机制中死循环处理,带你进一步了解agent工作底层原理
javascript·人工智能