Блог

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

Каков наилучший способ добавить все эти отдельные ответы от 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}amp;key=MYKEYamp;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
  

Обновлено

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

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