uniapp显示富文本效果demo（整理）

uniapp显示富文本：

<template>
	<view class="rtfBox">
		<view class="margin-left30 margin-right30 margin-top20 margin-bottom20">
			<rich-text :nodes="content"></rich-text>
		</view>
	</view>
</template>

<script>
	export default {
    
		components: {
    

		},
		data() {
    
			return {
    
				content: '',
			}
		},
		// 页面加载
		onLoad(e) {
    
			//uni.hideTabBar();	//不让底部显示tab选项
			console.log(e,'eeee');
			uni.setNavigationBarTitle({
    
				title: e.title
			})
			// var data = this.$.get_data('contentTxt');
			var data = '<p>隐私政策11</p><p><img src="https://public.haotiku.com/haotiku/videos/20220216/1644974733576.png" alt="" width="571" height="337" /></p><p>应用内集成的第三方SDK以及插件：<br />1.cn.jpush.android: 用来给用户推送应用内资讯信息以及消息通知。<br />2.com.alipay：用于app内会员支付信息费<br />3.com.umeng.commonsdk：用于微信 qq等第三方登录授权以及分享。<br />4.com.amap.api：高德地图用于发布职位定位，已经用户入职导航。</p>';
			data = data.replace(/\<img/g, "<img style='width: 100%;'");
			this.content = data;
		},
		// 页面显示
		onShow() {
    

		},
		// 方法
		methods: {
    
			
		},
		// 计算属性
		computed: {
    

		},
		// 侦听器
		watch: {
    

		},
		// 页面隐藏
		onHide() {
    

		},
		// 页面卸载
		onUnload() {
    

		},
		// 触发下拉刷新
		onPullDownRefresh() {
    },
		// 页面上拉触底事件的处理函数
		onReachBottom() {
    },
	}
</script>

<style lang="scss" scoped>
	.rtfBox {
    }
</style>

<!-- 主要代码 -->
<rich-text :nodes="content"></rich-text>
<script>
	export default {
    
		data() {
    
			return {
    
				content:''
			}
		},
		onLoad(){
    
			var data = '<p>隐私政策11</p><p><img src="https://public.haotiku.com/haotiku/videos/20220216/1644974733576.png" alt="" width="571" height="337" /></p><p>应用内集成的第三方SDK以及插件：<br />1.cn.jpush.android: 用来给用户推送应用内资讯信息以及消息通知。<br />2.com.alipay：用于app内会员支付信息费<br />3.com.umeng.commonsdk：用于微信 qq等第三方登录授权以及分享。<br />4.com.amap.api：高德地图用于发布职位定位，已经用户入职导航。</p>';
			data = data.replace(/\<img/g, "<img style='width: 100%;'")
			this.content= data;
		},
		
		methods: {
    
			
		}
	}
</script>