vue projects always get out of high moral map problem

Disclaimer: This article is a blogger original article, shall not be reproduced without the bloggers allowed. https://blog.csdn.net/qq_34664239/article/details/90311997

Creating a map is a very simple API, but can not get out a map from time to time, this problem is serious, and sometimes can not find the real reason.
After numerous tests, we need to find a map of the rules

problem

vue is a single-page application, the same map two id, the problem will not get out of
concrete Why, is not yet known, according to this law, all the maps are standardized to solve the problem often can not get out of the map

method

1. The map is not the same for each page id to be set

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

2. When routing Jump to destroy Map

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

upgrade

If that does not work, the last is to do a map cache
each time by the way do not need to destroy the map, each time coming in, reload the data, re-map to mark (so to create a map, and marked on the map split into two method, and every time to clear all the marks clearMap (down) on the map before marking)