VUE 中引入百度地图(vue-Baidu-Map)

安装

npm install vue-baidu-map --save

全局注册

在main.js 里面配置
// 使用百度地图
import BaiduMap from 'vue-baidu-map'
Vue.use(BaiduMap, {
  /* Visit http://lbsyun.baidu.com/apiconsole/key for details about app key. */
  ak: '######'
})

vue 页面使用

<template>
  <div>
    <baidu-map class="map" :center="center" :zoom="zoom" @ready="handler" />
  </div>
</template>

<script>
export default {
data() {
    return {
      center: {
        lng: 0,
        lat: 0
      },
      zoom: 3
    }
  },
methods: {
    handler({ BMap, map }) {
      console.log(BMap, map)
      this.center.lng = 116.404
      this.center.lat = 39.915
      this.zoom = 15
    },
}
}
</script>