vue-baidu-map组件的使用

vue-baidu-map是使用vue集成了百度地图的插件，文档还算不错，且基本的功能都有例子。
这里给出中文文档官网地址链接: vue-baidu-map.

前几天遇到了个问题：就是在使用BmLocalSearch组件去进行位置检索的时候，它会默认的附带标点，如下图所示；

如何清除BmLocalSearch的默认附带标点

这里的文档中是没有这样的api去进行清除的 对它进行style上的操作也不可取，因为我还有业务上的标点需要展示，折腾了一会最终得出了解决方案。

解决方案

这里用到了百度地图的api removeOverlay
要是用这个api，我们就要先获取到map的实例

handler({ BMap, map }) {
      this.center.lng = 108.95;
      this.center.lat = 34.27;
      this.zoom = 15;
      this.map = map; //这里的map就是百度地图的实例，把他赋给一个变量保存。
},

然后在进行地图检索的时候对它进行 removeOverlay 清除所有的点，
自己的业务数据的点在进行清除操作后再标记，代码如下：

<baidu-map
        style="width: 100%; height: 800px"
        class="map"
        :scroll-wheel-zoom="true"
        :center="center"
        :zoom="zoom"
        @ready="handler"
        ak="你的ak"
      >
        <BmLocalSearch
          :keyword="searchKeyword"    //这里是检索的关键字
          @searchcomplete="searchcomplete"  //完成检索时调用
          :pageCapacity="1"
        ></BmLocalSearch>
        <bm-marker
          v-for="(marker, index) in mapMarkers"  //自己的业务数据点
          :key="index"
          :position="marker.position"
          :dragging="false"
          @click="mapMarkerClick(index, marker)"
        >
          <bm-geolocation
            anchor="BMAP_ANCHOR_BOTTOM_RIGHT"
            :showAddressBar="true"
            :autoLocation="true"
          ></bm-geolocation>
        </bm-marker>
      </baidu-map>

searchcomplete(e) {
    this.$nextTick(() => {
      if (e && e.Hr && e.Hr[0]) {
        this.center = e.Hr[0].point;  //这里获取了检索的位置并跳转
        var allOverlay = this.map.getOverlays();
        this.map.removeOverlay(allOverlay[allOverlay.length-1]);
        this.init();  //这里的init就是接下来的业务操作。
      }
    });
  },

过程大概就是这样了 ，本来是很简单的 但是刚开始浪费时间在想办法去操作它的dom或者控制它的样式上面了 ，说到底还是vue-baidu-map的集成的不够完善 嗯 是这样的