el-tooltip的二次封装：css3文本溢出显示省略号 + el-tooltip的显示控制

使用场景：文本溢出时需要对文本进行处理；相对于一定高度的容器，溢出容器部分的文本显示省略号，同时，鼠标移入通过显示tooltip来显示文本的具体内容

组件的二次封装

组件的使用

// html

    


// css
.tooltip-wrap {
   width: 200px;
   height: 40px; // 必须要有高度设置，因为tooltip的显示条件是通过高度来判断的
  display: inline-block;
  display: -webkit-box;
  -webkit-line-clamp: 1; // 因为通过高度所以只显示一行，溢出显示省略号
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}