在vue中使用高德地图,获取定位
作者:互联网
第一步:在index.html中引入标签
<script src = 'https://webapi.amap.com/maps?v=2.0&key=高德的密钥'></script>
第二步:在vue.config.js中进行相应的配置
module.exports = {
configureWebpack: {
externals: {
AMap: 'AMap' // 高德地图配置
}
}
}
第三步:在vue文件中进行定位方法的调用
首先引入:import AMap from 'AMap'
之后在methods中调用一下方法,即可获取到城市信息
// 获取定位
getLocation () {
const _this = this
AMap.plugin('AMap.CitySearch', function () {
var citySearch = new AMap.CitySearch()
citySearch.getLocalCity(function (status, result) {
if (status === 'complete' && result.info === 'OK') {
// 查询成功,result即为当前所在城市信息
console.log('通过ip获取当前城市:', result)
_this.autolocation = result.city
}
})
})
}
标签:定位,vue,citySearch,获取,result,高德,AMap 来源: https://blog.csdn.net/m0_59501287/article/details/120809428