在vue中使用高德地图获取坐标与地址信息(包含点击+搜索)
首先
注册登陆高德地图 https://lbs.amap.com/
划过头像里面有个应用管理点开
进入到应用管理打开我的应用
选择创建应用
然后按照要求填写内容，切记一定要选择web端(JS API),填写完后提交当前应用。
完了这么多只是为了获得key
然后
打开项目
npm install vue-amap --save
安装地图依赖
打开项目中的mian.js文件
将下面复制进去，并替换为你自己应用的key
import aMap from 'vue-amap' // 这个引入的最好放在引入的vue上面
Vue.use(aMap)
aMap.initAMapApiLoader({
key: '*******************************', // 你的key
plugin: ['AMap.Autocomplete', 'AMap.PlaceSearch','AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.Geolocation','AMap.Geocoder', 'AMap.AMapManager', 'AMap.Marker'],//应用功能项
v: '1.4.4', //版本
uiVersion: '1.0' //ui版本
})
新建一个demo组件
用户可以直接获取当前位置信息以及通过搜索选中地址,点击地图,获取经纬度与地址信息,点击确认按钮可操作传递你的经纬度与地址(包括放大缩小卫星路况路网) 对了 里面有element-ui组件 可以配置一下也可自行改变(样式依旧自己写)