我尝试将数据Map为
import React from 'react'
import axios from 'axios'
import {useEffect, useState} from 'react'
export default function Home() {
const [data, setData] = useState([])
useEffect(() => {
axios.get('http://127.0.0.1:8000/api/books').then(res => {
console.log(res.data)
setData(res.data)
}).catch(err => console.log(err))
}, [])
return (
<div>
{data.map(book => (
<h1>{book.title}</h1>
))}
</div>
)
}
在控制台中,数据显示如下
{data: Array(100)}
data
:
(100) [{…}, {…}, {…}, {…}, {…}, ]
[[Prototype]]
:
Object
错误是
如何解决这个问题我尝试了很多方法,但都不起作用,请帮助我
2条答案
按热度按时间rks48beu1#
console.log(res.data)
显示它有一个数据对象,该数据对象组成数组,所以应该像setData(res.data.data)
那样设置,目前正在设置对象,不能和map
一起使用0mkxixxg2#
您可以看到控制台的数据为{data:数组(100)}
所以你需要更新状态