vue 文字超出以...显示，鼠标放上去换行显示全部

1:HTML

 

        
客户须知：
        

          
        
      

2:换行函数

toBreak(val, num) {
      // 备注内容提示过长。强制间隔20个字符换行
      var str = val
      var number = num// 间隔换行的字符数
      var bytesCount = 0// 定义一个变量记录字符串总字节长度
      var s = ''// 定义一个空字符串用来接收重新拼接换行之后的字符串
      var pattern = new RegExp('[\u4E00-\u9FA5]+')// 汉字的正则表达式
      for (var i = 0; i < str.length; i++) { // 遍历原字符串
        var c = str.charAt(i)// 拿到每一个下标对应的值
        // 统计字符串的字符长度
        if (pattern.test(c)) {
          bytesCount += 2// 如果是汉字长度+2
        } else {
          bytesCount += 1// 不是汉字长度+1
        }
        s += str.charAt(i)// 重新拼接字符串
        // 换行
        if (bytesCount >= number) { // 在指定的长度位置插入换行标签
          s = s + '
'
          // 重置
          bytesCount = 0// 保证在下一个相同长度后继续换行
        }
      }
      return s
    }

3:css

.info_value{
        width: 100%;
        color: #000;
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }