ElementUI中table表格自定义表头Tooltip文字提示

在ElementUI中，可以通过自定义表头（scoped slot）来实现表头的Tooltip文字提示。以下是一个简单的示例代码：

<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column label="日期">
      <template slot-scope="scope">
        <el-tooltip class="item" effect="dark" placement="top-start">
          <div slot="content">这是日期列的提示信息</div>
          <div>{{ scope.row.date }}</div>
        </el-tooltip>
      </template>
    </el-table-column>
    <!-- 其他列 -->
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        },
        // ...更多数据
      ]
    };
  }
};
</script>

在这个例子中，我们定义了一个带有Tooltip的日期列。当鼠标悬停在单元格内容上时，会显示出Tooltip，提示用户相关信息。你可以将这个模式复制并应用到其他列上，只需要更改slot="content"中的文本以及{{ scope.row.date }}中的date字段即可。