dangfei-weapp/pages/team/team.vue

<template>
	<view class="contentBox">
		<view v-if="info.name">
			<view class="title">{{info.name}}</view>
			<!-- <view class="time">{{info.updated_at}}</view> -->
			<rich-text class="content" :nodes="info.introduction"></rich-text>
		</view>
		<view v-if="loading && !info.name" class="noInfo">暂无团队简介</view>
	</view>
</template>

<script>
	
	import { teamInfo } from "../../api/index.js"
	
	export default{
		data(){
			return{
				info:{
					name:"",
					introduction:"",
					updated_at:""
				},
				loading: false
			}
		},
		onShow() {
			const that=this
			teamInfo().then(res=>{
				that.loading=true
				const {error_code}=res
				if(error_code===200){
					let content=res.data.introduction
					const regex = new RegExp('<img', 'gi');
					content = content.replace(regex, `<img style="width: 100%;height:auto;margin:10px 0"`);
					res.data.introduction=content
					that.info=res.data
				}
			}).catch(e=>{
				console.log(e)
				that.loading=true
			})
		}
	}
</script>

<style lang="scss">
	page{
		width: 100%;
		min-height: 100%;
		background: $uni-bg-color-normal;
		overflow-x: hidden;
	}
	.contentBox{
		font-size: 24rpx;
		color: #4D4D4D;
		padding: 20rpx 26rpx 20rpx 31rpx;
	}
	.title{
		text-align: center;
		margin-bottom: 20rpx;
		font-size: 32rpx;	
	}
	.orgTitle{
		text-align: center;
		margin: 50rpx auto;
	}
	.time{
		text-align: center;
		padding-bottom: 20rpx;
	}
	.content{
		overflow-x: hidden;
		line-height: 50rpx;
		
	}
	.content img{
		display: block;
		width: 100%;
		height: auto;
	}
	.noInfo{
		text-align: center;
		padding: 10px 0;
	}
</style>