uniapp 实现微信小程序修改rich-text图片样式

最新推荐文章于 2024-05-12 22:56:40 发布

Treasure girl1

最新推荐文章于 2024-05-12 22:56:40 发布

阅读量855

点赞数

分类专栏： uni-app 微信小程序文章标签：小程序 uni-app

本文链接：https://blog.youkuaiyun.com/Xinacridine/article/details/117035874

版权

uni-app 同时被 2 个专栏收录

25 篇文章

订阅专栏

微信小程序

20 篇文章

订阅专栏

<template>
	<gui-page>
		<view slot="gBody">
			<view class="htext">
				<rich-text :nodes="content"></rich-text>
			</view>
		</view>
	</gui-page>
</template>
<script>
	export default {
		data() {
			return {
				content: '',

			}
		},
		onShow() {
			this.content = '富文本地址'
				.replace(/<p>/ig, '<p style="font-size: 15px; line-height: 25px;">')
				.replace(/<img([\s\w"-=\/\.:;]+)((?:(height="[^"]+")))/ig, '<img$1')
				.replace(/<img([\s\w"-=\/\.:;]+)((?:(width="[^"]+")))/ig, '<img$1')
				.replace(/<img([\s\w"-=\/\.:;]+)((?:(style="[^"]+")))/ig, '<img$1')
				.replace(/<img([\s\w"-=\/\.:;]+)((?:(alt="[^"]+")))/ig, '<img$1')
				.replace(/<img([\s\w"-=\/\.:;]+)/ig, '<img style="width: 100%;" $1')
		},



	}
</script>