vue多版本共存(@amap/amap-jsapi-loader)
首先提示大家,对于是否要使用vue-amap这个组件,请三思后而行,组件化和插件按需引入确实比较方便,但是已经不支持高德2.0API 且有很多坑点,因为作者大概在2019年后就没有再管过这个项目,所以推荐大家使用兼容高德2.0 API的amap-vue(没错 这俩不是一个东西)
使用场景
公司的项目之前一直使用的是vue-amap 引入的高德API版本也是1.4.4的旧版本,所以很多功能如绘制geo区域等都不能使用,但是有这个需求,我们就得去兼容更高的版本,然鹅vue-amap并不兼容2.0,引入2.0会直接报错,官方的issue也有人提出,但作者并未给出回答,故必须舍弃vue-amap
但是舍弃掉vue-amap 更改所有地图相关的页面 工作量又太大 所以我就想到了一个办法,能不能让2.0和1.4.4版本共存?
实现
最后的方案是 vue-amap 和 @amap/amap-vue 组件共存,amapvue 组件完美兼容2.0 api 推荐使用
实现共促的方法很简单,需要引入一个npm包 @amap/amap-jsapi-loader
使用方法:
import AMapLoader from '@amap/amap-jsapi-loader'
AMapLoader.reset();
在初始化的时候调用reset()方法就好了