vue中快速使用百度地图：vue-baidu-map

先上效果图：

1. 安装 vue-baidu-map：

   npm install vue-baidu-map --save
   

2. 引入

   • 全局引入

     	vue.use(BaiduMap,{
     			ak:' ' // 		
     			}) 
     				```
     			
     

   • 局部引入

     import baiduMap from 'vue-baidu-map/components/map/Map.vue';
     

3. 在需要的页面使用

   		
   	<template>
   	  <div>
   	    <baidu-map
   	      class="bm-view"
   	      ak="YOUR_APP_KEY"
   	      :zoom="zoom"
   	      :center="center"
   	    />
   	  </div>
   	</template>
   	
   	<script>
   	import baiduMap from 'vue-baidu-map/components/map/Map.vue';
   	export default {
   	  name: 'BaiduMap',
   	  components: {
   	    baiduMap,
   	  },
   	  data() {
   	    return {
   	      center: { 
   			      lng: 116.288072,  //经纬度
   			      lat: 39.829756 
   	      },
   	      zoom: 19, //放大比例
   	    };
   	  },
   	};
   	</script>
   	
   	<style scoped>
   	.bm-view {
   	  width: 100%;
   	  height: 300px;
   	}
   	</style>
   
   
   

这里是vue-baidu-map的中文官方文档 vue-baidu-map，需要可以点击进去查看。