uni-app获取位置信息(经纬度转换地址信息)

uniapp获取位置信息，获取到的信息为经纬度，再通过转换成地址信息

1.使用uni.getLocation()获取位置信息
2.下载qqmap-wx-jssdk.js插件插件下载地址
3.使用腾讯位置服务器对经纬度进行一个地址信息转换(自己创建一个应用即可)

全都勾选上

4.注意！！关键之处！！ 一定要在微信公众号平台上 服务器配置 apis.map.qq.com

上代码
template

<view><button @click="getLocation">获取位置</button></view>

js

methods:{// 获取当前位置getLocation(){const that =this;// 获取位置信息
            uni.getLocation({type:'wgs84',success(res){// 经纬度转化地址信息const qqmap =require('@/pages/qqmap-wx-jssdk.min.js');const showmap =newqqmap({key:'NWSBZ-ZUME4-LLTU6-XSQGB-YBKAT-U4FCZ'});// 逆地址解析reverseGeocoder
                    showmap.reverseGeocoder({location:{latitude: res.latitude,longitude: res.longitude
                        },success(result){// 地址信息const adres = result.result.address;
                            that.address = adres;
                            console.log(adres);// 此处使用的this不是指向vc// 所在在头部先获取到this复制给that}});},fail(e){let errMsgTit ='';if(e.errMsg ==='getLocation:fail auth deny'){
                        errMsgTit ='你已拒绝授权，是否跳转至设置页面开启权限';}else{
                        errMsgTit ='操作频繁提示，建议搭配onLocationChange()使用';}
                    uni.showModal({title:'提示',content:`${errMsgTit}`,success(res){if(res.confirm){// 获取设置页面权限信息
                                uni.getSetting({success(res){
                                        console.log(res.authSetting);// 判断是否开启获取位置权限if(!res.authSetting['scope.userLocation']){// 如果没有开启，点击确认后打开设置页面
                                            uni.openSetting({});}}});
                                console.log('用户点击确定');}elseif(res.cancel){
                                console.log('用户点击取消');}}});}});}}

效果图

完结~

不当之处望指点