el-table文字默認情況下若內容過多會折行顯示，若需要單行顯示可以給el-table-column使用show-overflow-tooltip屬性，它接受一個Boolean，為true時多余的內容會在 hover 時以 tooltip 的形式顯示出來。

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

總結

以上是生活随笔為你收集整理的el-table文字超出隐藏；el-table表格文字一行展示，超出隐藏，多余的内容会在 hover时显示 ；的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。