карта не является функцией в ReactJS

#reactjs

#reactjs

Вопрос:

Когда я сделал console.log(response.data), он вернул 2 набора данных, а именно post и user:

  const [dbdata,setDBData] = useState([])

useEffect(async() => {
        const response = await Axios.get('http://localhost:5000/api/posts/allpost', {withCredentials:true})
    setDBData(response.data)
    console.log(response.data)
    }, [])


{post: Array(2), user: Array(1)}
post: (2) [{…}, {…}]
user: [{…}]
 

Поэтому, когда я попробовал dbdata.post.map() , он говорит, что map() не является функцией. Чего мне здесь не хватает? Заранее большое спасибо и с благодарностью.

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

1. Я предполагаю, что данные с сервера пусты. Проверьте консоль. войдите в систему response.data .

2. есть данные. {сообщение: массив (2), пользователь: массив (1)}

3. Пожалуйста, опубликуйте минимальный код, чтобы люди могли помочь. из фрагмента мы не уверены, какой из них выдал ошибку. dbdata.post.map() отсутствует в коде, которым вы поделились.

4. Определите свое состояние следующим образом — const [dbdata,setDBData] = useState({post: [], user: []})

5. Спасибо. Итак, как мне решить эту проблему? Извините, я все еще не знаком со многими сценариями.

Ответ №1:

Проблема

Начальное состояние — это пустой массив []

 const [dbdata,setDBData] = useState([]);
 

so dbdata.post и / или dbdata.user оба не определены, если вы пытаетесь отобразить и сопоставить их при первоначальном рендеринге.

 dbdata.post.map(...) // <-- throws error since dbdata.post undefined
 

Решение

Укажите правильное начальное состояние, чтобы начальный рендеринг имел допустимое состояние для доступа и сопоставления.

 const [dbdata,setDBData] = useState({ post: [], user: [] });