div内容超出容器宽度，超出显示省略号且鼠标悬浮显示全部内容

div内容超出容器宽度，超出部分显示省略号且鼠标悬浮显示全部内容，实现效果如下图：

1.首先设置容器不换行，超出部分隐藏为省略号；

2. 添加   :title ="显示全部内容"

代码如下：

<div class="whover" :title="item.descr">{{ item.descr == 'null' ? '-' : item.descr }}</div>


.whover{

     white-space: nowrap; // 不换行
     overflow: hidden; // 隐藏
     text-overflow: ellipsis; // 显示为省略号
}