uniapp解析富文本图片溢出,超出的问题

1、在App.vue组件中(h5),直接在App.vue修改即可:

uni-rich-text img {
	max-width: 100% !important;
}

2、关于小程序和APP里面图片溢出问题,可以通过正则的方式,给图片添加宽度100%,高度auto的样式  借鉴文章(附上原文:https://www.jb51.net/article/154976.htm)

formatRichText(html) {
		let newContent = html.replace(/]*>/gi, function(match, capture) {
			match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
			match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
			match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
			return match;
		});
		newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) {
			match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, 'max-width:100%;');
			return match;
		});
		newContent = newContent.replace(/]*\/>/gi, '');
		newContent = newContent.replace(/\

 

你可能感兴趣的:(uniApp,uniapp,富文本图片溢出)