uniapp gets current location in real time

First we need to download a plug-in (Amap official website plug-in)

(The main function of the plug-in is to obtain the current geographical positioning or its own location, and can return the name)

Related downloads - WeChat mini program plug-in | Amap API (amap.com) https://developer.amap.com/api/wx/download

Use it in conjunction with the examples on the uniapp official website,

Write at the beginning of the script

import amap from '../../common/amap-wx.130.js'

Click event section

			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 part

po_tips: '重新定位',

position: '', //定位获取的位置

 

html part

				<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>