WEB-超出范围的文本用“...“替代

1.运用函数实现(关键内容为蓝色部分）

 truncateText(内容，长度) 

truncateText(text, length) {

      if (!text) return;

      const strippedText = text

        .replace(/<\/?[^>]+(>|$)/g, "")

        .replace("&nbsp;", " ");

      return strippedText.length <= length

        ? strippedText

        : strippedText.slice(0, length) + "...";//控制字符个数，对字符串进行切割且加上“..."

    },

 2.css实现

• 单行

white-space: nowrap;

overflow: hidden;

text-overflow: ellipsis;

参考网址： css white-space属性详解-CSDN博客

• 多行 

white-space: normal;

overflow: hidden;

text-overflow: ellipsis;

display: -webkit-box;// 使用弹性盒子布局模型显示元素，该属性在Webkit浏览器中生效。

-webkit-line-clamp: 2;//设置显示的行数为2行，超出的部分将被省略。

-webkit-box-orient: vertical;//设置弹性盒子的主轴方向为垂直方向，即元素内容按垂直方向排列。