Vue進階（九十三）：show-overflow-tooltip實現表格列內容過長顯示提示

在Vue項目中，使用ElementUI顯示表格數據時，如果某一個列數值長度超過列寬，會默認換行，造成顯示不友好。

翻閱Element-UI文檔，可發現show-overflow-tooltip列屬性可實現列內容過長被隱藏時顯示tooltip的功能。

注：show-overflow-tooltip屬性需要謹慎使用，如果一個頁面多列使用，會影響頁面加載速度。因為show-overflow-tooltip 屬性雖然可以解決文本超長時的問題，但當前是在所有的單元格中插入 tooltip 組件包裝來簡單實現的。

tooltip 組件使得 DOM 結構成倍增加，而且每個 tooltip 內部都有至少兩個監聽事件。這對大數據量表格來說性能是可以想象的到的。所以在中后臺系統中大量數據的表格展示需要優化改進。

demo

1

2

3

4

5

6

Vue

版權聲明：本文內容由網絡用戶投稿，版權歸原作者所有，本站不擁有其著作權，亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容，請聯系我們jiasou666@gmail.com 處理，核實后本網站將在24小時內刪除侵權內容。

版權聲明：本文內容由網絡用戶投稿，版權歸原作者所有，本站不擁有其著作權，亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容，請聯系我們jiasou666@gmail.com 處理，核實后本網站將在24小時內刪除侵權內容。