正文

在element-ui的表格组件中为表头添加Tooltip 文字提示

IP云
IP云V管理员/4 阅读
11/25
提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

在使用表格组件的时候经常遇到的问题，列数很多，而表头的文字描述长度很长 

 <el-table-column

         v-if="!column.event"

         v-for="(column, index) of columns"

         v-bind="column.bind"

         align="left"

         :key="index">

         <template slot-scope="scope" slot="header">

           <el-tooltip effect="dark" :content="column.needTips" placement="top"

                       :disabled="!column.needTips">

             <span>{{column.bind.label}}</span>

           </el-tooltip>

         </template>

       </el-table-column>

需要注意的是 

<template slot-scope="scope" slot="header">

文档中有提示可使用通过设置 Scoped slot 来自定义表头。

相关阅读

目录[+]