返回 Promise 的函数，这是 Promise 解决后要使用的一组选项

Question

在我的代码中 loadOptions 给了我以下错误消息“返回承诺的函数，这是承诺解决后要使用的选项集。” 但我已经在代码中做了一些尝试，但没有成功。 谁能帮我理解 loadOptions 中出现的这个错误？

 import { useState } from 'react'; import { MapContainer, TileLayer, Marker, Popup } from 'react-leaflet'; import AsyncSelect from 'react-select/async'; import { fetchLocalMapBox } from '../api'; const initialPosition = { lat: -22.7532328, lng: -43.4563604 } type Place = { label?: string; value?: string; position: { lat: number; lng: number; }; } function OrderLocation() { const [address, setAddress] = useState<Place>({ position: initialPosition }) const loadOptions = async (inputValue: string, callback: (places: Place[]) => void) => { const response = await fetchLocalMapBox(inputValue); const places = response.data.features.map((item: any) => { return ({ label: item.place_name, value: item.place_name, position: { lat: item.center[1], lng: item.center[0] }, place: item.place_name, }); }); callback(places); };

<div className="filter-container">
                    <AsyncSelect 
                        placeholder="Digite um endereço para entregar o pedido"
                        className="filter"
                        loadOptions={loadOptions}
                        onChange={value => handleChangeSelect (value as Place)}
                    />

Answer 1

文档说

loadOptions道具允许用户从回调中解析...

或从返回的承诺中解决......

……但不是两者兼而有之。 如果您正在使用返回承诺的async function ，请通过return值来使用选项解决承诺。 不接受回调：

const loadOptions = async (inputValue: string) => {
    const response = await fetchLocalMapBox(inputValue);
  
    const places = response.data.features.map((item: any) => ({
        label: item.place_name,
        value: item.place_name,
        position: {
            lat: item.center[1],
            lng: item.center[0]
        },
        place: item.place_name,
    }));
  
    return places;
//  ^^^^^^
};