Question

尝试从API提取数据并显示它们时出现错误。我正在使用useState和useEffect。确实，我仍然不了解它，我正在尝试学习并实现这一目标。

import React, {useState, useEffect} from 'react'

function About() {
    const [userData, setUserData] = useState(true)
    async function getData() 
        {
           let response = await fetch('https://api.github.com/users');
           let data = await response.json();
            setUserData(data)
            return data;
        }
        //call getData function
        // getData()
        // .then(data => console.log(data)
        // );//
    useEffect(() => {
        getData()
        .then(
           data => {
               setUserData(data) }
        )
    }, [])

    return (
        <div>
           {
             userData.map((item, index) => (
                 <div key={index}>
                     <span>{item.login}</span>
                 </div>
             ))
           }
                 
        </div>
    )
}

我想了解是否有任何资料要指向我，我进行了搜索，但是我看到setState为基于类的组件，但是我正在使用基于函数的组件

Answer 1

我认为有两个问题。

首先，通过将状态设置为true，您将无法映射它。换句话说，您正在尝试执行true.map，该操作无法在布尔值上执行。将状态设置为空数组。

第二，始终检查获取的数据是否为数组，否则不能使用.map

我使用fetchAPI和useState收到此错误“ TypeError：userData.map不是函数”

1 个答案: