ElementUI的el-table的el-table-column内容过长处理

在ElementUI的el-table组件中，如果el-table-column内容过长，可以使用show-overflow-tooltip属性来实现工具提示，显示被隐藏的内容。

以下是一个简单的例子：

<template>
  <el-table
    :data="tableData"
    style="width: 100%">
    <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="地址"
      show-overflow-tooltip>
    </el-table-column>
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [{
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路1518号上海市普陀区金沙江路1518号上海市普陀区金沙江路1518号'
      }, {
        date: '2016-05-04',
        name: '李小虎',
        address: '上海市普陀区金沙江路1517号'
      }, {
        date: '2016-05-01',
        name: '赵小虎',
        address: '上海市普陀区金沙江路1519号'
      }, {
        date: '2016-05-03',
        name: '孙小虎',
        address: '上海市普陀区金沙江路1516号'
      }]
    }
  }
}
</script>

在这个例子中，address列的内容如果超出了列宽，将会显示省略号，并且当鼠标悬停在该单元格上时，会显示完整的内容。这是通过show-overflow-tooltip属性实现的。