我无法访问 Json 数据并在 React 中使用 axios 将其显示在表格中

Question

我正在尝试使用挂钩访问 json 数据并将其显示在

标签，但它显示错误-“TypeError：states.map 不是函数”。我还使用 Array.from() 将我的 json 转换为数组，它没有显示任何错误，但也没有显示任何内容。

  var rows=[{}];
  export default function Mainpage() {
const [states, setstate] = useState([]);
const getLatestJSPost = () => {
    const API_URL = "http://localhost:8080/Displaydo";
    axios
    .get(API_URL)
    .then((response) => {
        
        // rows = Array.from(response.data);

        console.log(response.data);
        setstate(response.data)

    })
    };
    useEffect(() => {
        getLatestJSPost();        
        
    }, [])
return (
    <div>
        <p>Hello</p>
        { states.map((ndata) => { 
                return <p key={ndata.doc_id}> {ndata.doc_id} </p>
                })}  
    </div>
)

}

conole.log(response.data) 看起来像console.log(response.data) 的 Output

Answer 1

你可以这样做：

 <div>
    <p>Hello</p>
    {states.length>0 && states.map((ndata) => { 
            return <p key={ndata.doc_id}> {ndata.doc_id} </p>
            })}  
</div>