【Vue】实现文字超出部分显示为省略号

785 阅读1分钟

实现效果:

超出34个字符的部分显示为省略号...

Snipaste_2023-07-13_14-44-42.png

实现方式:

定义一个filter,当字数超过34个字符时自动显示为省略号

 <!-- 医生简介 -->

                    <div class="doctor_discration">
                        <span class="discration">
                            擅长:{{ item.discration|ellipsis }}
                        </span>
                    </div>
   filters: {
    ellipsis (_val) {
      if (!_val) return ''
      if (_val.length > 34) {
        return _val.slice(0, 34) + '......'
      }
      return _val
    }},