自定义ElementUI el-table 的列tooltip，解决当tooltip文字多（超过1000字），高度不够一直闪，不显示的问题，主要还是max-width的设置，别无他法，就加大最大宽度

shiningchen322

已于 2022-05-27 17:16:02 修改

阅读量3.3k

点赞数 1

分类专栏：前端 Vue.js 文章标签： elementui vue.js

于 2022-05-27 17:13:12 首次发布

本文链接：https://blog.csdn.net/shiningchen322/article/details/125007385

版权

当ElementUI的el-table tooltip内容过多导致高度不足时，通过设置特定列的max-width来防止闪烁并确保显示完整。本文提供了一种实现方式，并讨论了全局设置max-width的替代方案。

摘要由CSDN通过智能技术生成

                     <el-table-column 
                          min-width="130"
                          prop="remark"
                          label="原因"
                          align="left"
                          header-align="left"
                          key="remark"
                          class-name="reasonCol"
                      >
                        <template slot-scope="scope">
                          <el-tooltip
                            popper-class="reasonPopper"
                            placement="bottom-end"
                            v-model="scope.row.showTooltip"
                            :disabled="!scope.row.showTooltip"
                            :content="scope.row.remark"
                          >
                            <div @mouseenter