Попытка передать переменную состояния с несколькими ответами на вызовы API

Я впервые использую API карт Google и мне наконец удалось получить карту для отображения на экране. Сейчас я работаю над добавлением маркеров местоположений, которые я получаю из других мест в моем приложении. Когда я перебираю местоположения, чтобы получить их соответствующие координаты широты и долготы, я хочу добавить их в свою переменную состояния. В настоящее время у меня есть свой код, я получаю ответ, и он сохраняется в моей переменной состояния, но хранит только самый последний, а не все из них.

Как лучше всего добавить все эти отдельные ответы API в мою переменную состояния?

Вот мой код в настоящее время

     export const MapRender =(props) => {
    const {logs} = useContext(LogContext)
    const [latLong, setLatLong] = useState([])
    
    useEffect(()=>{
        logs.map(l =>{
            return fetch(`https://api.opencagedata.com/geocode/v1/json?q=${l.location}&key=MYKEY&limit=1`)
                .then(res => res.json())
                .then(parsedRes => setLatLong([parsedRes.results[0].geometry]))
            
            
        })
    },[logs])

console.log(latLong) --- returns a separate log for each response object, I want it to return one array with all responses

person Johnson4996    schedule 23.09.2020    source источник


Ответы (1)


Обновлено

Я не уловил этого, когда впервые ответил: наличие этого цикла, который устанавливает состояние на каждой итерации, приводит к тому, что множество рендеров ставится в очередь, что приводит к тому, что последний входящий ответ становится преобладающим.

Решение состоит в том, чтобы хранить все ответы в одном массиве, и когда все они будут завершены, вы можете установить состояние. Вы можете использовать это чтобы узнать, когда все обещания выполнены, а затем установить состояние.

person sebaslh12    schedule 23.09.2020
comment
Кажется, я все еще получаю только один объект в моем массиве состояний, когда я консоль журнала после нажатия каждого ответа, я все еще получаю отдельный журнал для каждого вызова - person Johnson4996; 23.09.2020
comment
Ага, плохо я этого раньше не видел, обновлю свой ответ - person sebaslh12; 24.09.2020