百度地图获取搜索后选中标注的名称、地址、坐标等信息

效果图

<template>
  <div>
    <label>
      <a-input-search placeholder="请输入关键字进行搜索" style="width: 200px;margin-bottom: 10px" v-model="keyword" />
    </label>
    <baidu-map id="map" class="map" center="成都" :zoom="zoom" @ready="handler">
      <!--缩放-->
      <bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
      <!--定位-->
      <bm-geolocation anchor="BMAP_ANCHOR_BOTTOM_RIGHT" :showAddressBar="true" :autoLocation="true"></bm-geolocation>
      <bm-local-search :keyword="keyword" :auto-viewport="true" :location="location" ></bm-local-search>
    </baidu-map>
  </div>
</template>

<script>
export default {
  name: "demo",
  data () {
   return {
     zoom: 51,
     location: '',
     keyword: ''
   }
  },
  methods: {
    handler ({BMap, map}) {
      // 鼠标缩放
      map.enableScrollWheelZoom(true);
      // 创建城市选择控件
      var cityControl = new BMap.CityListControl({
        // 控件的停靠位置（可选，默认左上角）
        anchor: BMAP_ANCHOR_TOP_LEFT,
        // 控件基于停靠位置的偏移量（可选）
        offset: new BMap.Size(10, 5)
      });
      // 将控件添加到地图上
      map.addControl(cityControl);
      // 点击事件获取标注信息
      map.addEventListener('click', function (e) {
        map.getOverlays().forEach((e, i) => {
          if (e.Bb != null) {
            console.log(e);
            console.log("content::" + e.Bb.content);
            //将字符串转换为html
            let parser = new DOMParser();
            let doc=parser.parseFromString(e.Bb.content, "text/html");
            console.log("address::" + doc.getElementsByTagName('td')[1].innerText );
            console.log("title::" + e.V.title);
            console.log("lng::" + e.point.lng);
            console.log("lat::" + e.point.lat);
          }
        });
      })
    },
  }
}
</script>

<style scoped>
.map {
  width: 100%;
  height: 400px;
}
</style>