vue项目中 高德地图总是出不来的问题

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_34664239/article/details/90311997

创建地图是个很简单的API，但是地图时不时的出不来，这个问题就严重了，一时真查不出原因。
经过无数的测试，发现地图需要规矩化

问题

vue是单页面应用，两个id一样的map，会出现出不来的问题
具体为什么，暂时还不知道，根据这个规律，将所有的地图都规范化，就解决了地图经常出不来的问题

方法

1. 每个页面的地图id要设置的不一样

<!--地图-->
<div id="carContainer"></div>
this.map = new AMap.Map('carContainer', {
   resizeEnable: true,
   zoom: 14,
   center:  [116.405467, 39.907761]
});

2. 路由跳转时，要销毁地图

destroyed() {
    if(!!this.map){
        this.map.destroy();
    }
}

升级

如果还是不行，最后就是做地图缓存
每次出路由的时候不需要销毁地图，每次进来的时候，重新加载数据，重新给地图做标记（所以创建地图，和在地图上做标记分开成两个方法，并且每次做标记前都要清空地图上的所有标记clearMap()下）