vue 引用地图之傻瓜式教程（复制粘贴即可用）

npm 下载

npm install vue-amap --save

main.js 代码

import AMap from 'vue-amap';

Vue.use(AMap);

AMap.initAMapApiLoader({

    key: 'XXX',//刚刚开发者申请哪里的key, 自行前往官网 ： https://console.amap.com/dev/key/app  -> 登录，我的应用，添加，选择 web（JS），之后生成的key 复制进来即可

    plugin: ['AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType']

});

vue 代码:

  import { lazyAMapApiLoaderInstance } from 'vue-amap';   export default{     name:'near',     mounted() {       lazyAMapApiLoaderInstance.load().then(() => {         this.map = new AMap.Map('amap-main', {center: new AMap.LngLat(121.59996, 31.197646)});       });     }   }     #amap-main{height: 300px;}