uniApp微信小程序使用腾讯地图定位功能及getLocation需要在app.json中声明permission字段问题解决

 更新时间:2022年12月24日 13:22:18   作者:Nanchen_42  
这篇文章主要介绍了uniApp微信小程序使用腾讯地图定位功能及getLocation需要在app.json中声明permission字段问题解决,需要的朋友可以参考下
(福利推荐:【腾讯云】服务器最新限时优惠活动,云服务器1核2G仅99元/年、2核4G仅768元/3年,立即抢购>>>:9i0i.cn/qcloud

(福利推荐:你还在原价购买阿里云服务器?现在阿里云0.8折限时抢购活动来啦!4核8G企业云服务器仅2998元/3年,立即抢购>>>:9i0i.cn/aliyun

获取腾讯地图的定位功能 

首先打开网址:腾讯位置服务

找到这三个位置并下载第3步的包

下载即可 

 解压完毕后有两个js文件,这里用min.js的包即可

 使用min.js的包放入common里

 用在哪个页面就在哪个页面中引入

	var QQMapWX = require('../../common/lib/qqmap-wx-jssdk.min.js'); 

接下来在onLoad中使用下面这段代码(当然也可以放入mounted里面)

qqmapsdk = new QQMapWX({
    key: '申请的key'
});

 这里的秘钥需要从官网中自己创建

创建好后会自动生成秘钥复制粘贴下来即可 

点击编辑 

勾选这三个√ 

保存

 

uni.getLocation({
    type: 'wgs84',
    success: function (res) {
        console.log('当前位置的经度:' + res.longitude);
        console.log('当前位置的纬度:' + res.latitude);
    }
});

 这里面的wgs84 uniApp官网中也给出了详细的解释

 success

latitude纬度,浮点数,范围为-90~90,负数表示南纬
longitude经度,浮点数,范围为-180~180,负数表示西经

打印结果如下: 

 拿到经纬度后通过经纬度返回他的地址

通过逆地址解析进行操作

完整代码如下 :

data(){
    return{
        qqmapsdk:{}
    }
}
onLoad() {
			this.qqmapsdk = new QQMapWX({
				key: 'XFIBZ-74JKO-3XCW3-SDVGT-FVOVF-RBFAS'
			});
			uni.getLocation({
			    type: 'wgs84',
			    success: (res)=> {
			        console.log('当前位置的经度:' + res.longitude);
			        console.log('当前位置的纬度:' + res.latitude);
					this.qqmapsdk.reverseGeocoder({
						success:(res)=>{
							console.log(res);
						}
					})
			    }
			});
		},

获取成功!!

最后渲染这个数据即可

可以创建一个空的字符串

用标签调用一下address即可完成 

  

注意:这个时候的数据并不一定是你现在的地址,因为是模拟器的环境。切换到真机测试即可看到您所在的地理位置

途中出现的“getLocation需要在app.json中声明permission字段”问题以及解决方案

 如果出现以下情况,请在manifest.json中添加以下代码

"permission": {
		  "scope.userLocation": {
		   "desc": "你的位置信息将用于小程序位置接口的效果展示"
		  }
		 },

以上就是

微信小程序使用腾讯地图定位功能及getLocation需要在app.json中声明permission字段问题解决的详细内容,更多关于uniApp微信小程序使用腾讯地图定位功能的资料请关注程序员之家其它相关文章!

相关文章

  • 一文读懂modbus slave和modbus poll使用说明

    一文读懂modbus slave和modbus poll使用说明

    modbus poll和modbus slave是一款实用的modbus开发和调试工具,可以非常方便的进行modbus调试,是非常有用的Modbus主机/从机模拟程序,这篇文章给大家介绍modbus slave和modbus poll使用说明,感兴趣的朋友一起看看吧
    2021-04-04
  • 建模UML用例图使用原理总结分析

    建模UML用例图使用原理总结分析

    这篇文章主要介绍了建模UML用例图使用原理总结分析,文中对uml所包含的元素以及关系类型作了详细的概括,有需要的朋友可以借鉴参考下
    2021-09-09
  • Matlab使用fft画出信号频谱图的方法

    Matlab使用fft画出信号频谱图的方法

    这篇文章主要介绍了Matlab使用fft画出信号频谱图的方法,本文通过实例图文相结合给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-04-04
  • Hbuilder连远程接服务器上传代码的图文教程

    Hbuilder连远程接服务器上传代码的图文教程

    下面小编就为大家分享一篇Hbuilder连远程接服务器上传代码的图文教程,具有很好的参考价值,一起跟随小编过来看看吧,希望对大家有所帮助
    2017-11-11
  • 汇编语言无效指令错误概述

    汇编语言无效指令错误概述

    此错误仅适用于奔腾 处理器、奔腾处理器与MMX技术、奔腾OverDrive处理器 和奔腾OverDrive处理器带有MMX技术。 奔腾Pro处理器, 奔腾II处理器和i486及更早版本处理器不受影响
    2012-07-07
  • HBuilder打包App方法(图文教程)

    HBuilder打包App方法(图文教程)

    下面小编就为大家带来一篇HBuilder打包App方法(图文教程)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-09-09
  • 一个能生成精美代码图片的工具Carbon!让看代码成为一种享受

    一个能生成精美代码图片的工具Carbon!让看代码成为一种享受

    当我们想展示自己写的代码给别人看的时候,希望让代码保持原有的格式,并且要美观一点,有一个强大的在线工具可以帮助我们实现,而且支持多种主题,他就是Carbon,需要的朋友可以参考下
    2021-05-05
  • K8S二进制部署的K8S(1.15)部署hpa功能

    K8S二进制部署的K8S(1.15)部署hpa功能

    这篇文章主要介绍了K8S二进制部署的K8S(1.15)部署hpa功能,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-04-04
  • 详解为什么现代系统需要一个新的编程模型

    详解为什么现代系统需要一个新的编程模型

    如今高要求的分布式系统的建造者遇到了不能完全由传统的面向对象编程(OOP)模型解决的挑战,但这可以从Actor模型中获益。
    2021-05-05
  • chrome开发者助手插件v2.10发布提升开发效率不再只是口号

    chrome开发者助手插件v2.10发布提升开发效率不再只是口号

    这篇文章主要介绍了chrome开发者助手插件v2.10发布提升开发效率不再只是口号,这个版本重点提升了常用工具的使用效率,需要的朋友可以参考下
    2021-03-03

最新评论

?


http://www.vxiaotou.com