在npm上好像没有高德地图官方的依赖库，所以我们需要自己写一个导入js组件（文章续集有）
<InculdeJS src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key" />
在mounted生命周期方法初始化地图
细节：网络较慢的情况，会导致执行mounted方法，js文件还未加载完毕，此时的window.AMap对象为空
定义一个定时器检查是否有加载完成
let spinFlag = 1
let spinTime = setInterval(() => {
if (window.AMap) {
let map = new window.AMap.Map("container", {
zoom: 12,
center: [经度, 纬度],
mapStyle: "自己定义地图的样式(可选)",
})
// 创建marker
let marker = new window.AMap.Marker({
icon: imgUrl,
position: new window.AMap.LngLat(经度, 纬度),
extData: {
markerId: "", //拓展数据
},
})
map.add(marker)
// 监听点击事件
marker.on("click", () => {
console.log(marker.getExtData())
})
} else {
if (spinFlag > 60) {
if (spinTime) clearInterval(spinTime)
}
spinFlag++
}
}, 1000)
