vue移动端进入页面获取当前地理位置实现方法

话不多说，直接写方法步骤，需要的直接拿去放在自己项目中即可使用
先看下效果图：

第一步：在项目中index.html文件中引入高德地图，如图所示：
 

 

第二步：在项目中创建一个js文件，然后把下面的代码全部拷贝进去

/**
 * 高德地图定位
 * @type {{}}
 */
export const location =  {
  initMap(id){
    let mapObj = new AMap.Map(id, {})
    let geolocation;
    mapObj.plugin(['AMap.Geolocation'], function () {
        geolocation = new AMap.Geolocation({
        enableHighAccuracy: true, //  是否使用高精度定位，默认:true
        timeout: 10000, //  超过10秒后停止定位，默认：无穷大
        maximumAge: 0, // 定位结果缓存0毫秒，默认：0
        convert: true, // 自动偏移坐标，偏移后的坐标为高德坐标，默认：true
        showButton: true, //  显示定位按钮，默认：true
        buttonPosition: 'LB',  // 定位按钮停靠位置，默认：'LB'，左下角
        buttonOffset: new AMap.Pixel(10, 20), //  定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
        showMarker: true, //  定位成功后在定位到的位置显示点标记，默认：true
        showCircle: true, //  定位成功后用圆圈表示定位精度范围，默认：true
        panToLocation: true,  //  定位成功后将定位到的位置作为地图中心点，默认：true
        zoomToAccuracy: true  //  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
      })
      mapObj.addControl(geolocation)
      geolocation.getCurrentPosition()
    })
    return geolocation;
  }
}

第三步：在需要用到的页面引入你创建的这个js文件（下面这是我的引入路径可以替换成你的即可）
 

import { location } from "../../pages/utils/LocationUtil";

第四步：就是在你需要用到获取当前地理位置的页面调用方法。首先在methods方法中声明方法，然后在mounted挂在后调用声明的方法即可
 

  methods: {
    /**获取地图定位*/
    getLocation() {
      let _that = this;
      let geolocation = location.initMap("map-container"); //定位
      AMap.event.addListener(geolocation, "complete", result => {
        _that.lat = result.position.lat;
        _that.lng = result.position.lng;
        _that.province = result.addressComponent.province;
        _that.city = result.addressComponent.city;
        _that.district = result.addressComponent.district;
      });
    },
}


 mounted() {
    this.getLocation(); // 调用获取地理位置
}

以上就是页面一进入弹出获取当前地理位置的实现方法，有需要的拿走直接用。
这个步骤以及使用方法我写的很清楚也很详细，谁都能看懂的，所以小白操作，直接拷贝粘贴即可。
以上文章还有些步骤需要更新，暂时没有时间呢，改天弄通了从头到尾重新梳理和整理一下再更新
喜欢博主的点关注，以后会多加更新问题和知识点！
大家相互学习，互相进步