話不多説，上步驟實現，先別問為啥，做就完事了。

實現手段上有兩種，一種是script標籤引入sdk（此處不做介紹），第二種使用高德AsMap包

  1. 安裝npm包
npm i @amap/amap-jsapi-loader --save
  1. 考慮複用性，建議封裝成組件使用，故創建組件自定義文件
import React, { useEffect, useState } from 'react';
import AMapLoader from '@amap/amap-jsapi-loader';

// 標註①：此處很重要，必配置
window._AMapSecurityConfig = {
  securityJsCode: "標註②：你自己的安全密鑰",
};

const BizGeocoder= () => {
  const [address, setAddress] = useState('');
  const [geocoder, setGeocoder] = useState(null);

  useEffect(() => {

// html5方法調用獲取經緯度，注意獲得的經緯度需要截取保留小數點後六位，否則高德接口不支持
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(
        (position) => {
          const latitude = position.coords.latitude;  // 緯度
          const longitude = position.coords.longitude; // 經度
          console.log("緯度:", latitude);
          console.log("經度:", longitude);
        },
        (error) => {
          console.error("獲取位置失敗:", error.message);
        }
      );
    } else {
      console.error("瀏覽器不支持 Geolocation API");
    }



// 初始化高德接口

    const initMap = async () => {
      try {
        const AMap = await AMapLoader.load({
          key: "標註③：你自己的key", // 高德測試Key
          version: "2.0",
          plugins: ['AMap.Geocoder'],
        });// 初始化地理編碼器
        const geocoderInstance = new AMap.Geocoder({
          city: "全國"
        });
        setGeocoder(() => geocoderInstance); // 使用函數式更新確保引用正確

      } catch (error) {
        console.error('地圖加載失敗:', error);
      }
    };

    initMap();

  }, []);

  // 示例：逆地理編碼方法
  const getReverseGeocode = (lnglat) => {
    if (!geocoder) return;

    geocoder.getAddress(lnglat, (status, result) => {
      if (status === 'complete' && result.regeocode) {
        setAddress(result.regeocode.formattedAddress);
      } else {
        console.error('逆地理編碼失敗:', result);
      }
    });
  };

  return (
    <div>
// 此處我偷懶，經緯度地址應該換成你上述調取獲得的東西，不應該寫死的
      <button onClick={() => getReverseGeocode([120.178447, 30.315514])}>
        獲取座標地址
      </button>
      <div>解析結果：{address}</div>
    </div>
  );
};

export default BizGeocoder;
  1. 解釋一下上述幾個備註，你要在高德地圖開放平台上，註冊成為開發者，然後創建應用，然後添加key，創建的key綁定的服務一定要是web端（jsSdk），這個是給前端用的，也是使用amap包時調用的服務，別選擇web服務端。然後域名白名單，不配置就是默認隨便一個都可以調用，不做限制。然後保存就可以看到生成了一個key和一個密鑰code，把它塞到標註②和③那裏
  2. 這時候就可以引入這個組件獲取地址信息了，非常粗略的版本，你要問我為什麼我也不知道