uniapp集成腾讯地图，获取当前定位城市

由于项目赶时间，我们前端进度太慢，被老板抓去做壮丁，在这里就把期间弄得定位问题给大家分享一下吧，希望对你有所帮助。

一、注册腾讯地图

1. 申请开发者密钥（key）：申请密钥
2. 开通webserviceAPI服务：控制台 -> key管理 -> 设置（使用该功能的key）-> 勾选webserviceAPI -> 保存
   (小程序SDK需要用到webserviceAPI的部分服务，所以使用该功能的KEY需要具备相应的权限)
   
3. 下载微信小程序JavaScriptSDK，微信小程序JavaScriptSDK v1.2

二、导入SDK

下载后解压，将里面的 qqmap-wx-jssdk.js 文件拷贝到项目里面。
然后在需要的页面导入。

import qqmapsdk from '../../sdk/qqmap-wx-jssdk.js'

三、实现

先创建实例。

const QQMapWX = new qqmapsdk({
	key: '在腾讯位置服务申请的key'
});

然后先调用 uni.getLocation 获取经纬度，然后再调用该js的方法去解析地址。

uni.getLocation({
	type: 'wgs84',
	geocode: true,
	success: (res) => {
		console.log("获取经纬度成功");
		this.latitude = res.latitude;
		this.longitude = res.longitude;
	},
	fail: () => {
		console.log("获取经纬度失败");
	},
	complete: () => {
		// 解析地址
		QQMapWX.reverseGeocoder({
			location: {
				latitude: this.latitude,
				longitude: this.longitude
			},
			success: function(res) {
				console.log("解析地址成功");
				console.log(res);
				// 省
				let province = res.result.ad_info.province;
				// 市
				let city = res.result.ad_info.city;
				console.log(province);
				console.log(city);
			},
			fail: function(res) {
				uni.showToast({
					title: '定位失败',
					duration: 2000,
					icon: "none"
				})
				console.log(res);
			},
			complete: function(res) {
				console.log(res);
			}
		})
	}
})

控制台输出如下：

如果在手机上定位失败，就在 manifest.json 里的指定地方加上两行代码：

    "app-plus" : {
    	/* 模块配置 */
    	"distribute" : {
    		/* 应用发布信息 */
            "android" : {
            	/* android打包配置 */
                "permissions" : [
                	"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
                    "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>"
                ]
            }
        }
    }

获取一下手机的定位权限。

由于本人并不是专业的前端，所以可能会有所瑕疵，如果你有不一样的见解，希望在下方评论区留言讨论哦~