vue项目中使用高德地图获取用户当前位置信息

项目背景是用vue开发的小程序，需要获取当前用户的地理位置，折腾了好久终于弄好了，今天分享给大家，话不多说，let's go!

第一步：在index.html页面引入高德地图

注意：引入地图的js一定要放在引用js的前面，不让会报'AMap' is not defined的错，放在所有script的最前面就对了。

第二步：直接写代码，把官网的粘过来就行了(https://lbs.amap.com/   高德）

然后找到服务里的定位

选择浏览器定位，可以选择亲手试一试

我的代码如下

    // 获取当前定位
    getLocation(){
      let that = this;
      var map = new AMap.Map('container', {
        resizeEnable: true 
      });
      AMap.plugin('AMap.Geolocation', function() {
        var geolocation = new AMap.Geolocation({
          enableHighAccuracy: true,//是否使用高精度定位，默认:true
          timeout: 10000,          //超过10秒后停止定位，默认：5s
          buttonPosition:'RB',    //定位按钮的停靠位置
          buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
          zoomToAccuracy: true,   //定位成功后是否自动调整地图视野到定位点
        });
        geolocation.getCurrentPosition(function(status,result){
          if(status=='complete'){
              that.onComplete(result)
          }else{
              that.onError(result)
          }
        });
      });
    },
    //解析定位结果
    onComplete(data) {
      this.signAddress = data.formattedAddress;
    },
    //解析定位错误信息
    onError(data) {
      console.log("定位失败:"+data.message);
    },

注意：1、this指向问题，不可以直接用this；

           2、该页面只要改东西就得重启项目，一遍不行就起两遍（可能第一遍是改完代码项目自己重新加载没有完成就进行了手动重启），不然会报'AMap' is not defined，我开始一报错就以为我的地图引入不合适，后来发现是因为改完没有加载到地图所以报错；

           3、如果此时打印定位失败的信息，不要慌，不是前面步骤的问题，而是你测试的浏览器设备拒绝了提供定位服务，火狐貌似已经禁止了定位服务，火狐高版本好像页禁止了，但是我用这个版本是可以测试的，用手机也不能定位，我以为只要手机开启定位服务就可以了，我的想法明显有点简单了，此时用的是浏览器定位，是要浏览器允许定位服务才可以，微信内置浏览器在微信7.0以后就禁止了定位服务，ios的高版本，10还是11来着记不清了，也禁止了，看到这我差点冲动把微信卸载了安装低版本的，幸好没冲动，然后用旁边不爱升级ios系统的妹子的手机测了一下是可以的，这我就放心了，那是不是有人问那现在被禁止的怎么办，我发现的方法里，貌似只剩下了升级协议，得把http升级成https。

好了，说完了，开发过程中会动不动就报'AMap' is not defined，要自信，不要觉得自己代码错了或者是地图引错了，只是地图没加载而已，老是定位失败，也不要怀疑自己的代码，是定位服务被禁止了，我就在自我怀疑的路上走了很久，都快自闭了（呜～～～～），希望对大家有帮助！