首页 > Web开发 > 详细

对v-html的文字做超出显示省略号

时间:2021-04-15 12:21:36      阅读:12      评论:0      收藏:0      [点我收藏+]

需求说明:使用v-html展示的效果为有格式的样式,需要做成不换行并超出显示...,结果如下图:

技术分享图片

 html代码:

<p v-html="$options.filters.ellipsis(item.title)"></p>

js代码:

filters: {
    //当渲染的文字超出9字后显示省略号
    ellipsis(value) {
      value = value.replace(/<.*?>/ig,"")       //把v-html的格式标签替换掉
      if (value.length > 30) {
        return value.slice(0, 30) + "...";
      }else{
        return value
      }
      ;
    }
  },

 

对v-html的文字做超出显示省略号

原文:https://www.cnblogs.com/meiyanstar/p/14661094.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!