高德地图

使用原生的可能要配置vue.config.js （只做记录，项目中未使用）

chainWebpack(config) { config.externals({ 'AMap': 'AMap' }) }

申请key的时候一定要选择web端！！！！！选个web服务搞了半天没搞出来

1.main.js：该搞的插件搞一搞

import VueAMap from 'vue-amap' Vue.use(VueAMap) VueAMap.initAMapApiLoader({ plugin: ['AMap.Geocoder', 'AMap.Geolocation'], key: 'a40a2e9b505abececf908c380759e38e' })

2.eslint去掉AMap的全局报错

module.exports = { root: true, env: { /* global AMap */ node: true }, 'extends': [ 'plugin:vue/essential', '@vue/standard' ], rules: { "space-before-function-paren": 0, 'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off', 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off' }, parserOptions: { parser: 'babel-eslint' } }

3.引入AMapManager ，一定要在data中注册，然后绑到组件上

<el-amap ref="map" class="amap-box" :center="center" :amap-manager="amapManager" :animateEnable="false" :zoom="zoom" :vid="'amap-vue'" :events="events" > </el-amap> import { AMapManager } from 'vue-amap' let amapManager = new AMapManager() data(){ return{ amapManager } }