h5+vue3 获取高德地图当前位置坐标

在H5页面中使用Vue3和高德地图（AMap）获取用户当前位置的坐标，你可以按照以下步骤操作：

1. 首先，你需要在项目中引入阿里的高德地图API库，可以通过CDN或者npm安装。

<!-- 使用CDN -->
<script src="https://webapi.amap.com/maps?v=1.4.18&key=your_amap_key"></script>

2. 安装高德地图Vue组件：
如果你想使用官方提供的高德地图UI组件，可以参考Vue-Amap插件（https://github.com/didi/van-angular-amap），对于Vue3，可以直接使用`@didi-ui/map`包。

3. 创建地图实例并监听位置变化事件：

import { useAMap } from '@didi-ui/map';

setup() {
  const mapRef = useRef();
  const { amap } = useAMap();

  // 初始化地图
  amap.init(mapRef.current);

  // 监听地图的初始化成功事件
  amap.on('ready', () => {
    amap.plugin('AMap.Geolocation', function (geolocation) {
      geolocation.getCurrentPosition((status, result) => {
        if (status === 'complete') {
          console.log('当前位置：', result.position); // 这里会得到经纬度坐标对象
        }
      });
    });
  });

  return {
    mapRef,
  };
}

记得替换`your_amap_key`为你自己的高德地图API key。