vue + vue-resource 請求天地圖

1.安裝好vue+vue-resource

2.引入天地圖

3.開始標點

注：以上步驟不需要過多解釋

4.喚起天地圖標點事件，並獲取到該點的經緯度

// 註冊點圖點擊事件（開啓地圖點擊事件並獲取經緯圖）
      addMapClick: function(){
        this.map.addEventListener("click",this.MapClick);
      },
      // 獲取經緯度
      MapClick: function(e){
        this.longitude = e.lnglat.getLng()
        this.latitude = e.lnglat.getLat()
        // 添加標準圖標
        let marker = new T.Marker(new T.LngLat(this.longitude, this.latitude))
        this.map.addOverLay(marker);
        marker.enableDragging();
        this.getadress(e.lnglat.getLng(),e.lnglat.getLat())
        this.removeMapClick()
      }

5.調用天地圖逆地理編碼查詢接口（http://lbs.tianditu.gov.cn/server/geocoding.html）

// 通過經緯度獲取當前地址信息
      getadress: function (longitude,latitude) {
        //let postStr = "postStr={'lon'="+longitude+",'lat'="+latitude+",'ver'=1}";
        //console.log(postStr)
        /*let postStr = {
          'lon': longitude,
          'lat': latitude,
          'ver': 1
        }*/
        //let datastr = JSON.stringify(datarray);
        let url = 'http://api.tianditu.gov.cn/geocoder?type=geocode&tk=6865d202ba9de8f30c45196961e83168'
        // Lambda寫法
        this.$http.get(url,{params:{postStr:"{'lon': "+longitude+",'lat': "+ latitude+ ",'ver': 1}"}}).then((response) => {
          // 響應成功回調
          let res = response.data
         console.log(response);
        })
      }

6.打印結果

7.注意事項

vue-resource的get方式：將postStr參數直接拼接到url上，請求路徑始終無法帶上postStr的參數，