React 高德逆编码组件：获取地址经纬度，无需地图

以下是一个基于 React 的输入地址高德逆编码组件的示例，它可以将用户输入的地址转换为经度和纬度，并不需要展示地图。

import React, { useState } from 'react';
import { Input } from 'antd';
import axios from 'axios';

const { Search } = Input;

const GeoDecoder = () => {
  const [location, setLocation] = useState({});

  const onSearch = async (value) => {
    try {
      const response = await axios.get(
        `https://restapi.amap.com/v3/geocode/geo?key=<YOUR_AMAP_API_KEY>&address=${value}`
      );
      const { geocodes } = response.data;
      if (geocodes.length > 0) {
        const { location } = geocodes[0];
        const [longitude, latitude] = location.split(',');
        setLocation({ longitude, latitude });
      }
    } catch (error) {
      console.error(error);
    }
  };

  return (
    <Search
      placeholder='输入地址'
      allowClear
      enterButton='搜索'
      size='large'
      onSearch={onSearch}
    />
  );
};

export default GeoDecoder;

这个组件使用了 Ant Design 的 <Input.Search> 组件作为输入框，并使用了 Axios 库来发送 HTTP 请求。在用户输入地址后，组件会向高德地图 API 发送一个逆编码请求，然后将返回的经纬度保存在 location 状态中。这些信息可以传递给其他组件或 API，以便后续处理。