el-table自定义单行超出显示省略号，鼠标移动显示tooltip（文本内容超出显示）

在Element UI的el-table组件中，可以通过设置show-overflow-tooltip属性来实现单行文本超出显示省略号，并通过鼠标悬停显示tooltip的效果。

以下是一个简单的示例代码：

<template>
  <el-table
    :data="tableData"
    style="width: 100%"
    max-height="250"
    show-overflow-tooltip>
    <el-table-column
      prop="date"
      label="日期"
      width="180">
    </el-table-column>
    <el-table-column
      prop="name"
      label="姓名"
      width="180">
    </el-table-column>
    <el-table-column
      prop="address"
      label="地址"
      width="200"
      show-overflow-tooltip>
    </el-table-column>
    <!-- 其他列 -->
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [{
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄(23909843840) 的房间'
      }, {
        date: '2016-05-04',
        name: '李小虎',
        address: '上海市普陀区金沙江路 1517 弄(23909843840) 的房间'
      }, {
        // ...更多数据
      }]
    }
  }
}
</script>

在这个例子中，show-overflow-tooltip属性被添加到了el-table和el-table-column标签中，这样超出宽度的文本就会显示为省略号，并且当鼠标悬停在上面时会显示出完整的文本内容。