vue使用百度地图API,点击地址，地图上调到相应地点

实现以下效果，点击按钮地图跳转到对应地址

1.申请百度秘钥，在index.html中引入

2.在webpack.base.conf.js中配置Bmap

3.vue页面中使用

<template>
  <div id="all">
    <ul>
        <li v-for="(item,index) in lists" :key="index" @click="getmap(item)">
          <button>{{item}}</button>
        </li>
    </ul>
    <div id="allmap"></div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      lists: ["东风西路办税服务厅", "广州体育中心", "五羊新城办税服务厅"],
      userlocation: { lng: "", lat: "" }
    };
  },

  mounted() {
    this.getmap();
  },
  methods: {
    getmap(item) {
      var map = new BMap.Map("allmap");
      map.centerAndZoom(new BMap.Point(113.27, 23.13), 11);
      var local = new BMap.LocalSearch(map, {
        renderOptions: { map: map }
      });
      local.search(item);
    }
  }
};
</script>
<style scoped>
* {
  margin: 0;
  padding: 0;
  list-style: none;
}
#suggestId {
  width: 398px;
  height: 30px;
}
#allmap {
  width: 400px;
  height: 400px;
  border: 1px solid black;
}
</style>