vue中使用高德地图

注册高德地图:
   第一步,注册高德开发者;

   第二步,去控制台创建应用;

   第三步,获取Key。
   
 vue中使用高德地图:
    第一步:安装 npm install vue-amap --save
    第二步:修改webpac.base.conf.js文件
     externals: {
    'AMap': 'AMap'
    },此外文件与entry平级
    第三步:在assets文件中新建一个js文件AMap.js
    export default function MapLoader () {   // <-- 原作者这里使用的是module.exports
      return new Promise((resolve, reject) => {
        if (window.AMap) {
          resolve(window.AMap)
        } else {
          var script = document.createElement('script')
          script.type = 'text/javascript'
          script.async = true
          script.src = 'http://webapi.amap.com/maps?v=1.3&callback=initAMap&key=您申请的key值'
          script.onerror = reject
          document.head.appendChild(script)
        }
        window.initAMap = () => {
          resolve(window.AMap)
        }
      })
    }
    第四步:在组件的文件中
    
    
复制代码

你可能感兴趣的:(vue中使用高德地图)