vue 工程中对接百度地图api，显示地图定位

1，安装，

npm install vue-baidu-map --save

或 yarn add vue-baidu-map --save

cnd方式：

<script src="https://unpkg.com/vue-baidu-map"></script>

2，全局注册

import Vue from 'vue' import BaiduMap from 'vue-baidu-map' Vue.use(BaiduMap, { // ak 是在百度地图开发者平台申请的密钥 详见 http://lbsyun.baidu.com/apiconsole/key */ ak: 'YOUR_APP_KEY' })

也可以在index.html中全局引用

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=这里是秘钥"></script>

3，局部注册

<template> 
    <baidu-map class="bm-view" ak="YOUR_APP_KEY"> 
    </baidu-map> 
</template> 
<script> 
import BaiduMap from 'vue-baidu-map/components/map/Map.vue' 
export default { 
    components: { 
        BaiduMap 
    } 
} 
</script> 

<style> 
.bm-view { 
    width: 100%; 
    height: 300px; 
} 
</style>

4，详细API JavaScript接口可以查看https://dafrok.github.io/vue-baidu-map/#/zh/start/usage

5，需要注册百度地图秘钥：http://lbsyun.baidu.com/