今天在富文本框加载图片,我原本以为他会到小程序里解析,所以将img改为了image发现不加载图片,随后改回去,发现图片加载了,但加载失败
然后看接口,发现后端传过来的地址是一个相对路径,而且文本里面的img标签没有写</img>,研究一段时间过后发现解决方法,路径在前面添加http://localhost就可以加载了,实际上线后,则改为公司的地址即可
代码如下
// 获取img标签的正则
let imgReg = RegExp(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi)
// 获取img标签
let str = data.content.match(imgReg)[0]
// 将协议和地址添加上去,顺便改一下样式
let strArr = str.replace('<img', '<img style="width:100%;height:auto"').replace('src="' ,'src="http://localhost').split('')
// 添加标签结尾
strArr.splice(strArr.length-1, 0, ' /')
const newStr = strArr.join('')
this.contentText = data.content.replace(str, newStr)
