Question

我在获取数据时遇到问题，但我不知道问题出在哪里。请看下面的代码

import React from 'react'

const App = () => {

  const [avatar, setAvatar] = React.useState([]);

  React.useEffect(() => {
   
    fetch("https://jsonplaceholder.typicode.com/users")
      .then((response) => response.json())
      .then((data) => setAvatar(data.name))
      .catch((error) => console.error("Error fetching data: ", error));
  }, []);

  return <div> 

      {avatar.map(item => (
        <p> {item.name} </p>
      ))}

     </div>;
};

export default App;

谢谢！

Answer 1

错误是您在 catch 语句之后缺少一个封闭的括号。

.catch(error => console.error("Error fetching data: ",error));

Answer 2

现在你忘记了你在 App.js 文件中的导入

import React from 'react';

而且看起来您获取的数据甚至不提供图像链接。如果您只想要名称，那么您可以使用 data[0].name 或类似的东西，因为获取的数据会解析为一个对象数组。

如何使用useEffect获取数据？

2 个答案: