vue-amap 初始化报错 AMap.PolyEditor is not a constructor 和 a[d].split is not a function

麦兜_冰夕

已于 2023-10-07 15:06:30 修改

阅读量3.9k

点赞数

分类专栏：数据可视化文章标签： vue-amap报错

于 2022-03-29 18:06:04 首次发布

数据可视化专栏收录该内容

14 篇文章

订阅专栏

本文介绍了解决项目中因使用多个版本的高德地图AMap导致的问题的方法。通过统一版本并在main.js中正确配置VueAMap插件，同时在index.html中引入必要的SDK和插件，可以有效避免版本冲突。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

原因：一个项目中用了多个版本的amap导致的问题

解决方案：统一版本，且按照下面的步骤操作

main.js中

import VueAMap from 'vue-amap'
Vue.use(VueAMap)
VueAMap.initAMapApiLoader({
  key: '6cf4109dca43906adfe00d4bbb6d93b5', // 康药麦麦高德key
  plugin: [
    'AMap.Autocomplete',
    'AMap.PlaceSearch',
    'AMap.Scale',
    'AMap.OverView',
    'AMap.ToolBar',
    'AMap.MapType',
    'AMap.PolyEditor',
    'AMap.CircleEditor',
    'AMap.Geolocation'
  ],
  // 默认高德 sdk 版本为 1.4.4
  v: '1.4.4'
})

然后再index.html中添加script 把plugin中的组件都引用下

注意：把script 放在body上面

<script type="text/javascript" src="https://webapi.amap.com/maps?key=6cf4109dca43906adfe00d4bbb6d93b5&v=1.4.4&plugin=AMap.Geolocation,AMap.Autocomplete,AMap.PlaceSearch,AMap.Scale,AMap.OverView,AMap.ToolBar,AMap.MapType,AMap.PolyEditor,AMap.CircleEditor"></script>