如何給element-ui table的數據增加懸浮提示？

場景：要使表格中的數據文字不換行，鼠標放上去就顯示數據內容，就像那種tip提示。該怎么實現呢？

只需加個屬性就能實現，沒錯就是這么簡單，就讓我們一起來看看吧！

 

先來看看效果圖吧：

 

這里我們用到 show-overflow-tooltip屬性，官方解釋：默認情況下若內容過多會折行顯示，若需要單行顯示可以使用show-overflow-tooltip屬性，它接受一個Boolean，為true時多余的內容會在 hover 時以 tooltip 的形式顯示出來。

 

直接上代碼：

 <el-table :data="tableData">
         <el-table-column
                    label="表頭內容"
                    align="center"
                    show-overflow-tooltip>
                <template slot-scope="scope">
                    <span>Hong Yuan International</span>
                </template>
            </el-table-column>
 </el-table>    

大功告成！