这个问题我在小程序社区中提的,后来有个帮我回答了这个问题,我试了一下可以。

解决办法是过滤富文本内容,给图片标签添加一个样式,限制图片的最大宽度。

replace(/\<img/gi,   '<img class="rich-img" ' );

就可以了

rich-text   .rich-img {

width: 100% ;

height: auto ;

}

微信小程序富文本中的图片大小超出屏幕的更多相关文章

  1. [微信小程序] 微信小程序富文本-wxParse的使用

    最近小程序蛮火的,公司要做于是学了一点点小程序 不知道你们有没有遇到过这种问题: 从公司服务器获取的文章内容是有HTML标签格式的一段内容,但是微信是不支持这些标签的,怎么办呢? 1.一般网站后台的文 ...

  2. 微信小程序富文本渲染组件html2wxml及html2wxml代码块格式化在ios下字体过大问题

    1.组件使用: 之前微信小程序的富文本渲染组件用的wxParse,对普通富文本确实可以,但是对于代码格式pre标签则无法使用. 下面这个html2wxml很不错,可以支持代码高亮. 详细文档:http ...

  3. 微信小程序-富文本解析插件wxParse基础使用及问题解决

    一.插件准备 在github上可以直接下载该插件:https://github.com/icindy/wxParse 二.基本使用 1.将插件导入项目: 将wxParse文件夹放在项目目录下,如图: ...

  4. 微信小程序 富文本插件 循环渲染方式

    感谢GitHub https://github.com/icindy/wxParse/wiki/wxParse%E5%A4%9A%E6%95%B0%E6%8D%AE%E5%BE%AA%E7%8E%AF ...

  5. 微信小程序富文本

    <div class="weui-panel__bd pad-all fs13 " > <rich-text nodes="{{detail.conte ...

  6. 适用于 Mpvue 的微信小程序富文本解析自定义组件

    废话不多说,直接上方法: 首先 npm 安装 mpvue-wxparse npm i mpvue-wxparse 接下来:使用 <template> <div> <wxP ...

  7. [转]wxParse-微信小程序富文本解析组件

    本文转自:https://github.com/icindy/wxParse 基本使用方法 Copy文件夹wxParse - wxParse/ -wxParse.js(必须存在) -html2json ...

  8. 微信小程序rich-text 文本首行缩进和图片居中

    微信小程序开发使用rich-text组件渲染html格式的代码,常常因为不能自定义css导致文本不能缩进,以及图片不能居中等问题,这里可以考虑使用js的replace方法,替换字符串,然后在渲染的同时 ...

  9. 微信小程序和支付宝小程序富文本使用

    微信小程序使用的是 1. wxml 页面元素的最简单使用 <rich-text nodes="{{这是你的数据}}"></rich-text>   2. j ...

随机推荐

  1. Git命令git update-index --assume-unchanged,忽略不想提交的文件(忽略跟踪)

    场景 我们在自己的私有测试分支上调试项目逻辑,给文件做了一些特定的修改,但是文件不想被git提交,不想执行git status命令时出现在modified列表里:再比如,我们本地的数据库和测试环境的数 ...

  2. 02:openf-falcon安装

    open-falcon其他篇 目录: 1.1 安装open-falcon环境准备 1.2 部署open-falcon后端 1.2.1 agent配置文件 1.2.2 transfer(数据上报) 1. ...

  3. draw9patch图片拉伸

    在此吐槽Android studio的稳定性,我用的Android studio已经完全不能用了.只要新建项目资源文件就会变成乱码.解决无果,忍无可忍的我只能重新下了一个低版本的.虽然还是有点毛病,但 ...

  4. python多进程apply与apply_async的区别

    为什么会这样呢? 因为进程的切换是操作系统来控制的,抢占式的切换模式. 我们首先运行的是主进程,cpu运行很快啊,这短短的几行代码,完全没有给操作系统进程切换的机会,主进程就运行完毕了,整个程序结束. ...

  5. MyEclipse运行Java出错:could not find the main class:test.program will exit(导入项目)

    自己新建的项目运行没有任何问题.但是我导入的很早以前别人写的项目,然后run就会弹框could not find the main class:test.program will exit 请确认JA ...

  6. spark streaming 整合kafka(二)

    转载:https://www.iteblog.com/archives/1326.html 和基于Receiver接收数据不一样,这种方式定期地从Kafka的topic+partition中查询最新的 ...

  7. Windows下命令行怎样登录MySQL

    直接cmd回车然后 “ mysql -u root -p  ”  登录时出现错误,原来是权限不够 打开cmd时需要以管理员的身份打开 然后继续使用 “ mysql -u root -p ” 还是不行, ...

  8. Thread线程相关方法详解

    1.sleep() 使当前线程(即调用该方法的线程)暂停执行一段时间,让其他线程有机会继续执行,但它并不释放对象锁.也就是说如果有synchronized同步快,其他线程仍然不能访问共享数据.注意该方 ...

  9. Vue.js 基本功能了解一下~

    一.写在前面 隔了这么久才来出Vue的第二篇文章,真是堕落了,自己先惩罚下/(ㄒoㄒ)/~~ 回过头看自己第一篇相关文章<初试 Vue.js>(http://www.cnblogs.com ...

  10. tensorflow中数据批次划分示例教程

    1.简介 将数据划分成若干批次的数据,使用的函数主要有: tf.train.slice_input_producer(tensor_list,shuffle=True,seed=None,capaci ...