微信公众号vue接入高德地图定位逆解析

引入模块

npm i @amap/amap-jsapi-loader --save-dev

引入组件

import AMapLoader from '@amap/amap-jsapi-loader'

模块初始化

initMap(lnglat) {
  AMapLoader.load({
    key: '你的密钥', // 申请好的Web端开发者Key,首次调用 load 时必填  
    version: '1.4.8', // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
    plugins: ['AMap.Geocoder', 'AMap.Geolocation'] //插件列表
  })
    .then(AMap => {
      this.AMapGetAddress(lnglat)
    })
    .catch(e => {
      console.log(e)
    })
},

调用逆解析地址

AMapGetAddress(lnglat = [120.187514, 30.250183]) {
  // debugger
  const geocoder = new AMap.Geocoder()
  let that = this
  geocoder.getAddress(lnglat, function (status, result) {
    if (status === 'complete' && result.regeocode) {
      console.log(result.regeocode.addressComponent.city)
      that.getStationIp(result.regeocode.addressComponent.city)
    } else {
      log.error('根据经纬度查询地址失败')
    }
  })
},

你可能感兴趣的:(高德组件,定位逆解析,vue.js)