H5用户地址位置选择地点获取经纬度（效果图）

最新推荐文章于 2024-08-26 03:36:52 发布

a_靖

最新推荐文章于 2024-08-26 03:36:52 发布

阅读量2.5k

点赞数

分类专栏： uni-app Web前端文章标签：选择位置腾讯地图开放平台位置选择

本文链接：https://blog.csdn.net/qq_35713752/article/details/106662985

版权

Web前端同时被 2 个专栏收录

404 篇文章 25 订阅

订阅专栏

uni-app

86 篇文章 14 订阅

订阅专栏

效果图：

uni-app

<template>
	<view class="flex-v flex-c wrap">
		<web-view src="https://apis.map.qq.com/tools/locpicker?search=1&type=1&key=7QKBZ-SJ2HF-7TFJS-JL5NE-E6ZD7-SWFW5&referer=鏅鸿兘鍚嶇墖"></web-view>
	</view>
</template>

<script>
	window.addEventListener('message', function(event) {
		let loc = event.data;
		if (loc && loc.module == 'locationPicker') {
			console.log('location', loc);
			uni.setStorageSync("locationData", {
				name: loc.poiname,
				addr: loc.poiaddress,
				latng: `${loc.latlng.lat},${loc.latlng.lng}`,
				city: loc.cityname,
				module: loc.module,
			})
			window.history.back();
		}
	}, false);
	export default {
		data() {
			return {

			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style>

</style>