多行文字省略(涵盖标点符号,中英文等复杂字符串)

1、最简单的就是使用css解决(最重要的是有注释的两行代码,不然打包时候会被清除)

display: block;
 width: 10rem;
 height: .9rem;;
 font-size: .32rem;
 font-weight:500;
 color:rgba(51,51,51,1);
 line-height:.45rem;
 overflow:hidden; 
 text-overflow:ellipsis; 
 display:-webkit-box; /* autoprefixer: off */ -webkit-box-orient:vertical; /* autoprefixer: on */ -webkit-line-clamp:2 // 行数

2、用JS截取,(会导致复杂字符串长度不一致)

moreTextEllipsis(data, name, len) {
    /**
     * 多出文字省略
     * @param {Array} data:需要切割的文字
     * @param {Number} len:需要保留的文字长度
     * @param {String} name:对应的键名
    */
    data.map((item, index) => {
      if (item[name].length > len) {
        item[name] = item[name].slice(0, len);
        item[name] = item[name] + '...'
      }
    })
    return data
  },
发布了21 篇原创文章 · 获赞 0 · 访问量 2843

猜你喜欢

转载自blog.csdn.net/weixin_39593730/article/details/103389170
今日推荐