首先我们需要先下载一个插件(高德地图官网插件)
(插件主要作用是获取当前地理定位或者是自身的位置,并且可以返回名称name)
相关下载-微信小程序插件 | 高德地图API (amap.com)https://developer.amap.com/api/wx/download
结合uniapp官网的示例一起使用,
在script中开头写
import amap from '../../common/amap-wx.130.js'
文章来源地址https://uudwc.com/A/MxROw
点击事件部分
getWarpweft() {
const that = this;
that.po_tips = '定位中...';
//
//
uni.getLocation({
type: 'wgs84', // 或 'gcj02'
success(res) {
console.log('定位成功', res);
that.po_tips = '重新定位';
const latitude = res.latitude;
const longitude = res.longitude;
// 调用逆地理编码方法获取地名
var myAmapFun = new amap.AMapWX({key:'ddb2a654bf6582459b81243b3bc45548'});
myAmapFun.getRegeo({
location:longitude +','+latitude,
success: function(data){
// console.log(data[0],99);
// that.position = data[0].regeocodeData.addressComponent.city;
that.position = data[0].regeocodeData.addressComponent;
console.log(data[0].regeocodeData.addressComponent.city,99);
//成功回调
},
fail: function(info){
//失败回调
console.log(info)
}
})
},
fail(err) {
console.log('定位失败', err);
that.po_tips = '定位失败';
// 处理定位失败的情况,例如提示用户或执行其他操作
},
});
}
data部分
po_tips: '重新定位',
position: '', //定位获取的位置
html部分
<view class="dingwei">
<text>当前位置地名:{{ currentAddress }}</text>
<view class="dingwei_city">
<view class="dingwei_city_one" @tap="back_city(position,true)">
{{position?position.city:'定位失败'}}
</view>
<view class="bold blue fmiddle" @click="getWarpweft">
<text>{{po_tips}}</text>
</view>
</view>
</view>
文章来源:https://uudwc.com/A/MxROw