Отображение Api в ReactJS

#javascript #reactjs #api

#javascript #reactjs #API

Вопрос:

Я пытаюсь перебирать данные из вызова API в ReactJS, но я продолжаю получать «TypeError: не удается прочитать свойство ‘map’ неопределенного» что я делаю не так?

 function TryFetch() {
const [camps, setCamps] = useState([]);



useEffect(() => {
    axios.get(api)
        .then( res => {
            console.log(res)
            setCamps(res.data)
        })
        .catch(err => {
            console.log(err);
        })
}, [])

return (

        <div>
            <ul>

                {camps amp;amp; camps.RECDATA.map(post => (
                    <li key={post.CampsiteID}>{post.CampsiteID}</li>

                ))}
                
                
                
            </ul>   
        </div>

    )
  

}

Комментарии:

1. Используйте инструменты разработчика Chrome для отладки вашего кода. Вы должны проверить значение camps , чтобы увидеть, что оно содержит.

2. Я думаю, вам нужно удалить [] параметр из useEffect() вызова.

3. Проверьте вывод консоли, чтобы увидеть, как res это выглядит.

4. удаление [] сработало, спасибо

Ответ №1:

На момент запуска react map первый раз RECDATA еще не определен.

Измените свой код следующим образом

Заменить {camps amp;amp; camps.RECDATA.map(post => ( на {camps amp;amp; camps.RECDATA amp;amp; camps.RECDATA.map(post => (

Комментарии:

1. api возвращает данные в объект со свойством RECDATA