vue 微信公衆號定位+高德地圖

遇到的坑,沒有搞清楚this指向導致微信定位拿到的經緯度賦值給高德地圖時,沒有賦值成功。

wxRegister() {
      var _this = this
      let mapdata={
        url:location.href.split('#')[0]
        // url:'http://vyljd.xiaoluxueche.com/cyry/'
      }
      this.$api.wxInfo(mapdata,'application/json;charset=UTF-8',d=>{
        if(d.resultCode === 0){
          var wxdata = d.record // PS: 這裏根據你接口的返回值來使用
          wx.config({
                debug: false, // 開啓調試模式
                appId: "wx573c7b770a66d1b1", // 必填,公衆號的唯一標識
                timestamp: wxdata.timessamp, // 必填,生成簽名的時間戳
                nonceStr: wxdata.nonceStr, // 必填,生成簽名的隨機串
                signature: wxdata.signature, // 必填,簽名,見附錄1
                jsApiList: [       // 必填,需要使用的JS接口列表,寫入自己用到的接口名稱
                  'checkJsApi',
                  'openLocation',
                  'getLocation',
                ]
            })
        }
    })
      wx.ready((res) => {
        //自動執行的
        wx.checkJsApi({
          jsApiList: [
              'getLocation'
          ],
          success: function (res) {
      //          alert(JSON.stringify(res));
              if (res.checkResult.getLocation == false) {
                  alert('你的微信版本太低,不支持微信JS接口,請升級到最新的微信版本!');
                  return;
              }
           }
        })
          wx.getLocation({
              type: 'gcj02',// 默認爲wgs84的gps座標,如果要返回直接給openLocation用的火星座標,可傳入'gcj02'
              success: function (res) {
                // 將微信定位拿到的經緯度賦值給高德地圖
                  _this.lng = res.longitude; // 經度,浮點數,範圍爲180 ~ -180。
                  _this.lat = res.latitude; // 緯度,浮點數,範圍爲90 ~ -90
                  _this.mapCenter = [_this.lng, _this.lat];
                  _this.showMap = false
                  _this.loaded = true;
                  var map = new AMap.Map('amap',{
                    center:[111.740586, 40.854099],
                    resizeEnable:true,
                    zoom:10
                  });
                  console.log(map)
                  var geocoder = new AMap.Geocoder({
                    radius: 100,
                    extensions: "all"
                  });
                  console.log(geocoder)
                  // 將當前定位的座標轉換爲地址信息
                  geocoder.getAddress([_this.lng ,_this.lat], function(status, result) {
                    if (status === 'complete' && result.info === 'OK') {
                      if (result && result.regeocode) {
                        _this.$nextTick(()=>{
                          console.log(result)
                          _this.address = result.regeocode.formattedAddress;
                        });
                      }
                    }
                  });
              },
              cancel: function (res) {
                  alert('用戶拒絕授權獲取地理位置');
              }
          });
          wx.error(function (res) {
              alert(res.errMsg);
          });
      })
    },

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章