el-table设置自定义表头，当表头内容过长时，鼠标悬浮显示完整内容

代码：

<el-table-column label="来源" >
      <el-table-column
            v-for="(item, index) in list"
            :key="index"
            :prop="propValue"
            min-width="120"
        >
          <template slot="header" slot-scope="scope">
            <el-popover trigger="hover" placement="top">
              <span>{{item.value}}</span>
              <div slot="reference" style="width: 120px;padding: 0px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap;">
                <span>{{item.value}}</span>
              </div>
          </el-popover>
          </template>
        </el-table-column>
    </el-table-column>
View Code

 

效果图如下：

 

posted @ 2020-09-29 15:45  scallop  阅读(3152)  评论(0)  编辑  收藏  举报