uniapp-js富文本内容img图片自适应手机端

问题描述: (图片溢出情况)

首先我们来思考一下,应该需要怎么做,才能让图片自适应呢?

图片要自适应,不能溢出父类宽度,可以设置图片的max-width:100%就好了。一般后端接口返回的富文本数据是字符串,那么我们直接来操作字符串的替换就好了。

JS字符串替换,利用正则匹配一下img标签,然后再String对象的replace方法处理一下就好。

let str3 = "<img src='123'/> <img src='456'/> <img src='789'/>";
let result = str3.replace(/<img/g, '<img style="max-width: 100%;"');
//打印输出的结果
console.log(result);
posted @ 2021-01-25 17:11  小白同学哈  阅读(1502)  评论(0)    收藏  举报