bigDataApp/pages/expertDiagnosis/introduce.vue

<template>
	<view>
		<view style="position: fixed;z-index: 100;">
			<uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回"  title="详情"></uni-nav-bar>
		</view>
		<image :src="wormcasedata.img_urls" mode="" style="width: 100%;height: 320rpx;margin-top: 88rpx;"></image>
		<p class="name">{{wormcasedata.name}}</p>
		<view v-for="(item,index) in preventionArr" :key="index" class="prevention">
			<view class="prevention_title">
				<u-icon name="play-right-fill" size="24" color="#55A92D"></u-icon>
				<p>{{regexptitle[index]}}:</p>
			</view>
			<p class="prevention_con">{{item}}</p>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				wormcasedata:{},
				unititle:'',
				wormdata:{//虫子数据
					
				},
				disease:{//病害数据
					
				},
				preventionArr:[],
				regexptitle:[]
			}
		},
		methods: {
			async getIntroduce(data) {
				const res = await this.$myRequest({
					url: '/api/api_gateway?method=pest.pests.pests_info',
					data:{
						pest_id:data
					}
				})
				this.wormcasedata=res
				var regex2 = /\[(.+?)\]/g; // [] 中括号
				var str=this.wormcasedata.prevention
				var arr=str.match(regex2)
				var arrindex=[]
				for(var i=0;i<arr.length;i++){
					arrindex.push(str.indexOf(arr[i]))
				}
				for(var i=0;i<arr.length;i++){
					this.preventionArr.push(str.slice(arrindex[i]+arr[i].length,arrindex[i+1]))
				}
				for(var i=0;i<arr.length;i++){
					arr[i]=arr[i].slice(1,arr[i].length-1)
				}
				this.regexptitle=arr
			},
			clickLeft(){
				uni.navigateTo({
					url:"./wormcase?name="+this.unititle
				})
			}
		},
		onLoad(option){
			console.log(option)
			this.unititle=option.title
			this.getIntroduce(option.id)
		}
	}
</script>

<style lang="scss">
	.name{
		font-size: 34rpx;
		font-weight: 700;
		width: 95%;
		margin: 20rpx auto 0;
	}
.prevention{
	font-size: 28rpx;
	color: #919191;
	width: 95%;
	margin:  20rpx auto;
	.prevention_title{
		display: flex;
		p{
			margin-left: 20rpx;
			color: #000000;
			font-size: 28rpx;
			font-weight: 700;
		}
	}
	.prevention_con{
		padding-left: 6%;
	}
}
</style>