Vue 如何在PC端官网调用接入百度地图

1.项目根目录下下载百度地图插件

　npm install vue-baidu-map --save

2.在首页index.html中引入百度地图（建议先上百度地图申请企业密钥）

个人申请的密钥为 （仅供测试使用 ）：3bVHdeo2ZZaZO4QczC63d0kMsbA55ZSD

<script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=密钥"></script>

3.在显示地图的组件中 template 中：

<template>
  <div>
    <div class="baidumap" id="allmap"></div>//地图的容器
  </div>
</template>

4.在显示地图的组件中 script 中：

<script>
export default {
  data() {
    return {};
  },
  mounted() {
    this.baiduMap();
  },
  methods: {
    baiduMap() {
      let map = new BMap.Map("allmap"); // 创建地图实例

      let point = new BMap.Point(114.171711, 22.306414); // 创建点坐标
      map.centerAndZoom(point, 15); // 初始化地图，设置中心点坐标和地图级别
      map.enableScro