1、表格内容超出隐藏鼠标浮上去显示文字提示
如下可以先在el-table-column标签上添加宽度属性再添加show-overflow-tooltip属性
<el-table-column prop="name" label="姓名" width="120" show-overflow-tooltip></el-table-column>
这中文字提示在鼠标浮上去时会自动隐藏，如果想要不隐藏可以自己写一个方法。
2、表格内容需要隐藏一部分，但是鼠标浮上去可以显示完全并选中
这种就不能用show-overflow-tooltip属性了，可以使用formatter自己封装一个方法返回Tooltip组件。
首先字符串隐藏可能是前n位后n位或者中间m~n位，所以需要两个字段确定隐藏位置
其次隐藏的内容需要替换成什么字符串也需要是配置项
然后Tooltip组件的一些参数最好也是添加到配置项中，像placement
思路想好了就可以用代码实现了，具体如下：
import { h } from 'vue';
import { Tooltip } from 'element-ui';/*** 格式化生成隐藏的字符串及tooltip* @param {*} cellValue * @param {*} config * start: 开始显示的字符截取位置* end: 结束显示的字符截取位置，为负数则截取后面几位* padding: 隐藏的字符替换* placement: tooltip位置* @returns h
*/tableFormatterTooltip(cellValue, config = { start: 4, end: -4, padding: '****', placement: 'top' }) {if (!cellValue) return '';const defaultConfig = { start: 4, end: -4, padding: '****', placement: 'top' };let _config = Object.assign(defaultConfig, config);return h(Tooltip, {props: {content: cellValue,placement: _config.placement,}}, [h('span', cellValue.substring(0, _config.start) + _config.padding + cellValue.substr(_config.end))])}
使用直接在formatter上加上这个方法就行