uniapp 开发 需要一些模板以便于快速实现，避免重复工作

<template>
	<view class="flex-col page">
		<view class="flex-col group_5">
			<div class="title">{{data.name}}</div>
			<image class="pic" :src="configs.baseUrl+data.pic" mode="widthFix"></image>
			<view class="content">
				<u-parse :content="data.content" :tagStyle="style"></u-parse>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		newDetail
	} from '@/config/api.js'
	import configs from '@/config/config.js'
	export default {
		data() {
			return {
				id: 0,
				configs,
				data: {
					name: '',
					pic: '',
					content: ''
				},
				style: {
					// 字符串的形式
					p: 'font-size:28rpx;',
					span: 'font-size: 28rpx;',
				}
			};
		},
		onLoad(e) {
			this.id = e.id ? e.id : 2
			console.log(e)
			this.getdata();
		},
		methods: {
			getdata() {
				var that = this;
				newDetail({
					params: {
						id: that.id
					}
				}).then(res => {
					console.log(res)
					that.data = res
				}).catch(err => {

				})
			},
		}

	};
</script>

<style scoped lang="scss">
	.page {
		background-color: rgb(255, 255, 255);
		width: 100%;
		height: 100%;
		overflow-y: auto;

	}

	.title {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: nowrap;
		flex-direction: row;
		color: #000;
		font-size: 32rpx;
		padding-top: 30rpx;
		padding-bottom: 30rpx;
	}

	.pic {
		width: 690rpx;
		margin: 20rpx auto;
	}
	.content{
		width: 690rpx;
		margin: 0 auto;
	}
</style>