微信小程序（uniapp）获取用户位置信息及选择位置

1. 开发前准备

注册微信小程序账号并配置相关信息；
注册腾讯地图开放平台并完成应用创建等；
下载qqmap-wx-jssdk.min.js放到项目中；

2. 获取用户当前位置wx.getLocation

// #ifdef MP-WEIXIN
this.initLocationInfoMP();
// #endif//初始化位置
initLocationInfoMP() {const _this = this;wx.getLocation({//type: 'gcj02', //wgs84返回gps坐标，gcj02返回可用于wx.openLocation 的坐标success: res => {// 将获取到的 经纬度传值给 formatAddress 解析出 具体的地址_this.formatAddress(res.latitude, res.longitude);},fail: res => {_this.$mHelper.toast('获取位置信息失败', 5000);}});
},
//解析通过微信获取到的经纬度地址
async formatAddress(latitude, longitude) {const _this = this;// 通过申请的key生成wxMap实例let map = new wxMap({key: "腾讯地图KEY"});// reverseGeocoder 为QQMapWX解析经纬度的方法map.reverseGeocoder({location: {latitude, longitude},success: res => {//res.result即解析得到的位置信息},fail: () => {_this.$mHelper.toast('获取位置信息失败', 5000);}})
}

3. 选择位置wx.chooseLocation（打开地图选择位置并返回数据）

//切换位置点击事件
chooseLocationMP() {const _this = this;wx.getSetting({success(res) {if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {uni.showModal({title: '是否授权当前位置',content: '你的位置信息将用于应用展示的周边商家，请确认授权',success: function(res) {if (res.cancel) {_this.$mHelper.toast('取消授权', 2000);return;}wx.openSetting({success: function(data) {if (data.authSetting["scope.userLocation"] !== true) {_this.$mHelper.toast('授权失败', 5000);return;}_this.$mHelper.toast('授权成功', 2000, 'success');_this.initLocationInfoMP();}})}})} else {wx.chooseLocation({success:(res) => {//res.latitude纬度, res.longitude经度//调用formatAddress解析经纬度得到位置信息},fail:() => {_this.$mHelper.toast('获取位置信息失败', 5000);}});}}});
}

微信小程序（uniapp）获取用户位置信息及选择位置相关推荐

微信小程序例子——获取用户登录信息
1.效果展示 2.关键代码 .wxml布局文件代码用户昵称:{{nickName}} 用户头像: 性别:{{sex}} 所在地址(省):{{province}} 所在地址(市):{{city}} . ...
微信小程序制作——获取用户信息
微信小程序制作--获取用户信息 1.获取用户信息方式一 wxml <view bindtap="getUserName">获取当前用户名</view> j ...
微信小程序授权获取用户信息和手机号码
微信小程序授权获取用户信息和手机号码 1.微信官方文档登录:https://developers.weixin.qq.com/miniprogram/dev/framework/open-abili ...
微信小程序授权获取用户信息
微信小程序授权获取用户信息小程序昵称突然变成了"微信用户",头像也不显示, <!-- 近期很多小伙伴通过该方法获取头像和昵称,代码也没有做改变,突然就变成了下面这样子 - ...
php取微信名字和头像,微信小程序如何获取用户头像和昵称
本文介绍了微信小程序如何获取用户头像和昵称,分享给大家,具体如下: 代码user.wxml: {{userInfo.nickName}} user.js //sort.js //獲取應用實例 var ...
微信小程序之获取用户基本信息
微信小程序之获取用户基本信息一.使用Redis存储access-token package com.qfjy.project.weixin.api.accessToken;import com.qf ...
微信小程序访问ip服务器,微信小程序如何获取code？微信小程序如何获取用户ip？...
微信小程序如何获取code?微信小程序如何获取用户ip?最近小编收到很多问题,其中一个就是下面小编为大家整理一下关于微信小程序如何获取code的步骤,希望这些方法能够帮助到大家. 首先,调用 wx.l ...
微信小程序 getPhoneNumber获取用户手机号
微信小程序 getPhoneNumber获取用户手机号在使用getPhoneNumber前,可以先看下官方文档:文档地址在注意这里,官方提到如果不使用之前wx.login调用获取的sessionK ...
微信小程序——最新获取用户昵称和头像的方法总结
前段时间微信小程序对获取用户昵称和头像方法进行了更新,网上很多的文章都已经不适用了,这里简单总结一下首先,传统接口wx.getUserInfo的效果会弹出一个给用户的弹窗,需要用户授权,经过测试传统 ...
微信小程序之获取用户地址
在微信小程序中获取定位信息今天一整天基本上都在处理在微信小程序中获取准确地址,给出定位并给出所在城市的问题.经过走了半天弯路,现在总结一下所需要的步骤. 一. 先到腾讯位置服务中心获取KEY 通过小 ...

微信小程序（uniapp）获取用户位置信息及选择位置

微信小程序（uniapp）获取用户位置信息及选择位置相关推荐

最新文章

热门文章