h5网页实现微信表情包+文字显示

前言（不像前言的前言，哈哈哈哈哈）：好久没有更新写文章了，前段时间太忙了，最近有空开始整理下项目中遇到的问题和解决方法。
不知道你们有没有遇到过要求在网页回显微信表情包，反正我是遇见了这样的要求，原因是我们后台有个富文本编辑框需要像微信朋友圈一样编辑，然后网页要回显。然后研究了下，主要用到了正则中的匹配和替换，为了以后遇到能够快速知道方法，特此记录下。
数据来源后端返回：数据大概是这样的字符串（包含了可能出现的所有情况文字+微信表情包+跳转链接+换行符）：'微信朋友圈[Rose][Watermelon]万物可爱[Wilt]\n\n\r努努力[BrokenHeart]链接'

var text = '微信朋友圈[Rose][Watermelon]万物可爱[Wilt]\n\n\r努努力[BrokenHeart]链接'
let regex=/\[(.+?)\]/g; // 匹配[]
                            let result,imgArr=[]
                            while((result=regex.exec(text))!=null) {
                                imgArr.push(result[1]) // 取出[]集合
                            }
                            let newStr=text
                            for(let item of imgArr){
                                newStr = newStr.replace("["+item+"]",'') // 替换微信表情包
                            }
                            newStr=newStr.replace(/[(\r\n)\r\n]+/,"
") // 替换换行符
                            newStr=newStr.replace(/\/,"") // 替换链接
                            newStr=newStr.replace("","") // 替换链接
                            console.log(newStr)

如果需要微信表情包图片图的私聊我。