场景:在开发地图选点中,后端需要adcode城市编码,这个需求需要根据经纬度进行转化(用的百度地图,其他地图请参考)
解决方案:通过jsonp将跳转链接获取到的值返回成json解析
第一步我们需要安装npm install vue-jsonp -save
第二步 在main.js中
import { VueJsonp } from 'vue-jsonp' //注这里必须用{ }包裹否者会报错。
Vue.use(VueJsonp)
第三不 在data中声明
cityUrl变量
cityUrl: 'https://api.map.baidu.com/reverse_geocoding/v3/?ak=改成自己的地图密码&output=json&coordtype=wgs84ll&location=', //(location接收经纬度参数)
//参考 https://api.map.baidu.com/reverse_geocoding/v3/?ak=改成自己的地图密码&output=json&coordtype=wgs84ll&location=32.145572,118.745663
第四具体代码
// 获取城市编码
let surl = this.cityUrl + e.point.lat + ',' + e.point.lng
console.log(surl)
this.$jsonp(surl).then(res => {
// console.log(res.result.addressComponent.adcode)
this.form.adCode = res.result.addressComponent.adcode
})
如有帮助请关注