前端web用腾讯地图api根据地址获取经纬度

需求：使用腾讯地图，通过输入的地址获取经纬度
1.先引入腾讯地图，参考https://blog.csdn.net/l13620804253/article/details/117254651
2.要调用腾讯地图API获取当前位置的经纬度，需要使用腾讯地图位置服务https://apis.map.qq.com/ws/geocoder/v1/接口（附上楼梯https://lbs.qq.com/service/webService/webServiceGuide/webServiceGeocoder），该接口前端直接正常请求会跨越，需要jsonp来避免报错；
3.引入jsonp：
1）安装vue-jsonp：

npm install vue-jsonp --save

2）在main.js中导入：

import { VueJsonp } from 'vue-jsonp'
Vue.use(VueJsonp）

4.定义方法：

// 根据地址获取坐标
    addrToGetCoordinate(addr) {
      this.$jsonp('https://apis.map.qq.com/ws/geocoder/v1/', {
        key: 'ZBABZ-S5LKO-AQAWR-SNHUD-V3AQS-MSBMB',
        output: 'jsonp',
        address: addr
      })
        .then((res) => {
          console.log(res)
          if (res.status === 0) {
            // 处理得到的经纬度
            this.coordinate.lat = res.result.location.lat.toFixed(6)
            this.coordinate.lng = res.result.location.lng.toFixed(6)
            this.postForm.store_longitude = res.result.location.lng
            this.postForm.store_latitude = res.result.location.lat
            // 用获取到的经纬度，修改地图的中心点
            this.changeCenter(res.result.location.lat.toFixed(6), res.result.location.lng.toFixed(6))
          }
        })
        .catch((e) => {
          console.log(e)
        })
    },

5.然后在对应的地方使用；

以上就是web端腾讯地图，通过地址获取经纬度的方法，记得关注点赞~~摸摸哒