知识分类
后端
前端
设计
开源组件/产品
APP
其他
广告招募

uniapp 中处理rich-text显示富文本图片溢出问题

管理员
发布于:2023-06-27 22:22:44

今天在做小程序时间,用rich-text组件显示富文本时发现图片太宽溢出了。怎么办?下面是一个简单的处理方法(当然也有其他的解决方案),方法如下:

		//处理图片溢出的问题
		let richtext = temp.content;
		const regex = new RegExp('<img', 'gi');
		richtext = richtext.replace(regex, `<img style="max-width: 100%;"`);

思路很简单 ,就是解析富文本中的img标签,给它强制加上最大宽度1000%,然后 rich-text中的node属性 就可以绑定richtext,图片就不会溢出了。

效果演示

处理前

处理后

上一篇:Jquery第三方插件,报错TypeError:$.browser is undefined
下一篇:uniapp的radio-group 清除选中的方法
搜索内容
最新文章
  • windows环境下php链接国产达
  • 免费的字体有哪些
  • 字体不能乱用小心侵权?
  • GIT客户端工具有哪些?
  • Git代码提交规范
  • 在前后端分离的时代,为什么还有人喜欢
  • 微信小程序开发有哪些框架
  • 目前流行的前端框架
  • VUE3语法糖介绍
  • 非可框架,懒人接口生成器应用发布,让
精彩文章
  • 1 MSYS2中安装使用GCC的正确方法
  • 2 JavaScript 判断对象是否为
  • 3 什么是PHP站群以及使用php开源框
  • 4 连接WIFI出现无Internet
  • 5 Layui 怎么样更换主题颜色?
  • 6 FrameCoder非可,基于web
  • 7 vscode用一个插件快速生成Vue
  • 8 小程序真机调试 报错 define
  • 9 常见主板开机进入bios热键,一张图
  • 10 3步教你如何修改uniapp but
工信部备案:苏ICP备2023011827号-1
苏公网安备 32111202000338号