vue2使用百度地图案例

以下是一个简单的 Vue2 百度地图案例：

1. 在 index.html 中引入百度地图 API：

<script src="http://api.map.baidu.com/api?v=2.0&ak=your_app_key"></script>

2. 在组件中引入百度地图：

<template>
  <div id="map"></div>
</template>

<script>
export default {
  data() {
    return {
      map: null
    }
  },
  mounted() {
    this.initMap()
  },
  methods: {
    initMap() {
      // 创建地图实例
      this.map = new BMap.Map("map")
      // 初始化地图，设置中心点坐标和地图级别
      const point = new BMap.Point(116.404, 39.915)
      this.map.centerAndZoom(point, 15)
    }
  }
}
</script>

3. 样式设置：

#map {
  width: 100%;
  height: 500px;
}

4. 注意事项：

- 需要在百度地图开放平台申请应用并获取 app key
- 百度地图 API 的使用需要联网
- 另外，还可以通过百度地图提供的 JavaScript API 实现更多功能，具体使用方法可以参考官方文档。