yiliangyiyun-app/pages/grain_pulse/localtion/localtion.nvue

<template>
	<view class="container">
		<view class="content">
			<map class="map" @markertap="markertap" :latitude="dataList.latitude" :longitude="dataList.longitude"
				:markers="covers">
			</map>
		</view>
		<view class="bottom">
			<text class="title">{{dataList.title}}</text>
			<text class="bottom-content">{{dataList.content}}</text>
			<view class="bottom-list-item">
				<view class='bottom-list-item'>
				<img class='right-img' src="/static/img/dizhi.png" alt="">
				<text class="bottom-list-item-left">{{dataList.localtion}}</text>	
				</view>
					<text class="metre">{{dataList.metre}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dataList: {
					tilte:'',
					content:'',
					localtion:'',
					metre:""
				},
				title: 'map',
				covers: []
			}
		},
		onLoad() {
		},
		onShow() {
			var data=uni.getStorageSync('location')
			this.dataList.title=data.title
			this.dataList.content=data.companyProfile
			this.dataList.localtion=data.province+data.city+data.area
			this.dataList.latitude = data.latitude
			this.dataList.longitude =data.longitude
			this.dataList.metre=data._metre
			console.log("data",data)
			let newmarker =[];
					var id=1;
					let maker= {
						id: id++,
						latitude: data.latitude,
						longitude:data.longitude,
						iconPath: '../../../static/img/weizhi@2x.png',
					}
					newmarker.push(maker)
					this.covers = newmarker
		},
		methods: {
			
		}
	}
</script>

<style scoped>

	.content {
		width: 750px;
		flex: 1;
	}
	.title {
		font-size: 28rpx;
		color: #333333;
		padding:0 20rpx;
		
	}
	.bottom-content {
		font-size: 22rpx;
		font-weight: 400;
		color: #333333;
		padding: 20rpx;
	}
	.map {
	 height: 2000rpx;
	}

	.bottom{
		position: fixed;
		bottom: 40px;
		width: 700rpx;
		left:25rpx;
		height: 180rpx;
		flex: 1;
		background: white;
		border-radius: 20rpx;
		padding: 20rpx 0;
	}
	.bottom-list-item{
		flex-direction: row;
		justify-content: space-between;
		padding:0 20rpx;
	}
	.bottom-list-item-left{
		font-size: 24rpx;
	}
	.right-img {
		width: 21rpx;
		height: 26rpx;
		margin-left:-20rpx;
		margin-right:10rpx;
	}
	.metre{
		font-size: 24rpx;
	}
</style>