elementui鼠标悬浮表头显示文字提示 and el-table 列内容溢出显示省略号悬浮显示文字

最新推荐文章于 2024-12-17 11:07:15 发布

bliss小宝

最新推荐文章于 2024-12-17 11:07:15 发布

阅读量7.7k

点赞数 3

分类专栏：前端笔记 vue 文章标签： elementui javascript vue.js

本文链接：https://blog.csdn.net/weixin_50001396/article/details/128828166

版权

elementui鼠标悬浮表头显示文字提示

1.在需要出现的位置添加

:render-header="renderHeader"

<el-table-column
          prop="fybh"
          label="房源编号"
          :render-header="renderHeader"
          sortable>
</el-table-column>

2.添加 renderHeader 方法

renderHeader(h,data){
   
      return h("span", [
        h(
            "el-tooltip",
            {
   
              attrs: {
   
                class: "item",
                effect: "dark",
                content: data.column.label,
                placement: "top",
              },
            },
            [h(&#