vue-element 内容显示过多隐藏（不仅限于table的列，可应用于div标签）

最简单的实现方法是在隐藏过长的table列，直接在 标签中添加一个属性show-overflow-tooltip即可。
但我的表格中，在同一列中不止有一种标签，我只想让这一列的某一部分实现这个效果，所以这种方法很不方便。

效果图如上

<el-table-column min-width="35%" show-overflow-tooltip>
       <template slot-scope="scope">
           <div style="line-height: 30px; font-size: 15px">
             {{ scope.row.name }}
           </div>
           <div class="desc" style="color: gray; font-size: 13px">
             {{ scope.row.desc }}
           </div>
       </template>
 </el-table-column>

desc字段是我需要实现过长隐藏成省略号的部分，在

.desc {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

样式中具体的方法属性可以参考：

  /*1. 先强制一行内显示文本*/
      white-space: nowrap;
  /*2. 超出的部分隐藏*/
      overflow: hidden;
  /*3. 文字用省略号替代超出的部分*/
      text-overflow: ellipsis;

参考的文章是：https://blog.csdn.net/weixin_44827418/article/details/105951905，里面还有部分拓展内容，但我没用到就不贴出来了。