情景描述:

1.发表文章页面是要vue-quill-editor富文本编辑保存的内容

2.在发表文章列表页面想展示部分内容作为文章简叙

3,直接用v-html 来展示html 可以展示然后设置外层容器的高度,可以实现,但是样式很难统一,富文本保存的内容的标签各种各样不好统一

解决办法

最后想着怎样将后台返回的html代码转化为纯文本来直接展示(网上百度看到这种方案,亲测有效)

html:

 <div class="desc">
    {{ getContent(item.questionContent) }}
 </div>


js:

//列表简叙文章调整
 getContent(HTML) {
    var content = HTML;
    return content
        .replace(/<(style|script|iframe)[^>]*?>[\s\S]+?<\/\1\s*>/gi, "")
        .replace(/<[^>]+?>/g, "")
        .replace(/\s+/g, " ")
        .replace(/ /g, " ")
        .replace(/>/g, " ");
  },

 

 

Logo

权威|前沿|技术|干货|国内首个API全生命周期开发者社区

更多推荐