小程序rich-text 富文本解析图片过大和图片路径的问题

小程序rich-text 富文本解析图片过大和图片路径的问题

1）图片路径问题

后台产品介绍或者资讯详细里上传图片，比如保存路径是网站的某个文件夹里，一般要用相对路径，比如路径是  /upload/202011/25/20201125001.jpg

小程序用rich-text组件来显示内容，就需要把图片路径前面加上域名等，需要做个替换操作：

wx.request提交给接口参数，比如返回值为res

res.data.content = res.data.content.replace(/src=\"/g, 'src="' + this.data.host);

其中host为data里定义的接口域名地址。

2）图片过大问题

详情里的图片如果不做处理，手机显示就出现显示不全问题，就是图片不能自动适应手机宽度，也需要对图片代码做个处理，用替换方法加上样式：

res.data.content = res.data.content.replace(/\<img/gi, '<img style="width:100%;height:auto" ');

this.setData({

  listDetail:res.data.data

})