uniapp使用腾讯云获取位置转为省市区

腾讯云获取位置转为省市区

腾讯位置服务提供了多种SDK程序包,其中的JavaScript版本的SDK适用于微信小程序,所以我们下载这个SDK包。

下载地址

在小程序项目中,创建lib目录,把SDK文件放入其中

js 复制代码
<script>
	var QQMapWX = require('../../lib/qqmap-wx-jssdk.min.js');
	var qqmapsdk;
	export default {
		data() {
			return {
				addrlocal: null,
			}
		},
		methods: {
			myLocation() { //5LFBZ-5HV6L-SAIPY-E6BNI-O7FOJ-XNFAN 
				const self = this; // 保存Vue实例的引用
				console.log(self.addrlocal);
				//获取地理定位
				uni.getLocation({
					type: 'wgs84',
					success: function(resp) {
						let latitude = resp.latitude;
						let longitude = resp.longitude;
						qqmapsdk.reverseGeocoder({
							location: {
								latitude: latitude,
								longitude: longitude
							},
							success: function(resp) {
								// console.log(resp.result)
								let address = resp.result.address
								let addressComponent = resp.result.address_component
								let nation = addressComponent.nation;
								let province = addressComponent.province;
								let city = addressComponent.city;
								let district = addressComponent.district;
								console.log("address:" + address +
									"addressComponent:" + addressComponent +
									"nation:" + nation +
									"province:" + province +
									"city:" + city +
									"district:" + district)
								self.addrlocal = city + district; // 使用保存的self
								console.log(self.addrlocal);
								/**
								 * address:吉林省长春市南关区东岭南街3355号addressComponent:[object Object]nation:中国province:吉林省city:长春市district:南关区
								 */
							}
						})
					}
				})
			}
		},
		components: {
			"fuwu": fuwuItem
		},
		onLoad: function() {
			qqmapsdk = new QQMapWX({
				key: '5LFBZ-5HV6L-SAIPY-E6BNI-O7FOJ-XNFAN'
			});
			this.myLocation();
		}
	}
</script>
相关推荐
逐流人19 分钟前
手工建集群到全自动发布:k8s集群部署与DevOps流水线整合实战
ci/cd·云原生·kubernetes·云计算·devops
wz97545 小时前
走进云计算:从硬件到云平台,读懂数字化底层基石
云计算
Kari111 天前
企业大模型RAG知识库从0到1搭建指南:腾讯云ADP+JOTO实战
人工智能·云计算·腾讯云
Kari111 天前
企业级智能体平台怎么选:腾讯云ADP与其他主流技术路线的架构对比
架构·云计算·腾讯云
头发还在的女程序员1 天前
基于 Spring Boot + Vue 3 + uni-app 的灵活用工系统:四端架构与业务流程设计
vue.js·spring boot·uni-app·灵活用工·灵工系统
无所畏俱的老尹3 天前
Agent 落地为什么需要影子对照:同输入只读双跑、写动作变提案、差异报警,比直接切全量更安全
人工智能·机器学习·云计算·aigc·devops
Dumbness3 天前
订阅消息弹窗必须在用户点击里调:联调实验室里 timing 和 Mock 支付通知踩的坑
javascript·uni-app
逐流人3 天前
DevOps 入门实战(一):从 CI/CD 概念到 Jenkins 自动构建部署
运维·云原生·云计算·jenkins·devops
SaaS_Product4 天前
OneDrive中的文件批量迁移到Zoho网盘
经验分享·云计算·saas·onedrive
码间留白4 天前
uni-app 鸿蒙离线打包:一个改动从源码到真机要穿过几条链
uni-app·鸿蒙·deveco·离线打包·uts插件