vue3高德地图监听 地图移动事件

在Vue3中使用高德地图(Amap)监听地图移动事件，可以使用`@dragend`或`@moveend`自定义事件。这两个事件分别会在地图拖动结束和地图位置改变结束时触发。

以下是基本的实现步骤：

1. 安装高德地图的Vue3插件，如`@vue-amap/core`：

npm install @vue-amap/core

2. 在模板中引入并设置地图，并监听地图移动事件：

<template>
  <div>
    <amap :center="mapCenter" :zoom="zoom" ref="myMap" @moveend="onMoveEnd"></amap>
  </div>
</template>

3. 在setup()中接收地图实例，定义`onMoveEnd`方法：

<script setup>
import { useAMap } from '@vue-amap/core';

const { map } = useAMap();

const onMoveEnd = () => {
  const center = map.getCenter(); // 获取当前地图中心坐标
  console.log('地图已移动到:', center);
};
</script>

当地图发生移动时，`onMoveEnd`函数将被执行，并打印出新的地图中心位置。