码迷,mamicode.com
首页 > Web开发 > 详细

vue 网页文字中带#的话题颜色高亮

时间:2018-11-02 23:40:53      阅读:296      评论:0      收藏:0      [点我收藏+]

标签:amp   网页   comment   ace   网页中显示   image   ext   text   src   

网页中显示文字时,带#开始和结束的文字蓝色高亮,就像微博话题一样
效果如下

技术分享图片

html

<span v-html="parseComments('#吃货节#有什么好吃的')"></span> // 方法里面可以是变量,这里只是个演示

js

parseComments (value) {
     var exp
     exp = /(#|#)((?!#).)*(#|#)/g
     value = value.replace(/<[^>]*?>(.*?)/gi, '').replace(/(.*?)<\/[^>]*?>/gi, '').replace(exp, (item) => {
       let newVal = '<span class="text-blue">' + item + '</span>'
       return newVal
    })
     return value
  }

vue 网页文字中带#的话题颜色高亮

标签:amp   网页   comment   ace   网页中显示   image   ext   text   src   

原文地址:https://www.cnblogs.com/lalalagq/p/9898444.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!