Reactjs 获取错误“；从fetchData返回的承诺被忽略；

我创建了一个从api获取数据的组件

import React，{useState，useffect}来自“React”；
常量用户=（）=>{
const[users，setUsers]=useState（[]）；
useffect（（）=>{
fetchData（）；
console.log（'effect'））
}, []);
const fetchData=async（）=>{
常量url=`https://jsonplaceholder.typicode.com/users`;
const response=等待获取（url{
方法：'GET'、//*GET、POST、PUT、DELETE等。
模式：'cors'，//无cors，*cors，同一来源
}
);
const data=wait response.json（）；
console.log（数据）
};
fetchData（）
返回(
);
};
导出默认用户我通过调用fetch甚至点击浏览器得到响应


const fetchData=async（）=>{
常量url=`https://jsonplaceholder.typicode.com/users`;
const response=等待获取（url{
方法：'GET'、//*GET、POST、PUT、DELETE等。
模式：'cors'，//无cors，*cors，同一来源
}
);
const data=wait response.json（）；
console.log（数据）
};
fetchData（）
以下更改将帮助您解决此问题：

import React, { useState, useEffect } from "react";

const Users = () => {
  const [users, setUsers] = useState([]);

  useEffect(() => {
    fetchData();
  }, []);

  async function fetchData() {
    const url = `https://jsonplaceholder.typicode.com/users`;
    const response = await fetch(url, {
      method: "GET",
      mode: "cors"
    });
    const data = await response.json();
    setUsers(data);
  }

  return (
    <div style={{ display: "flex", flexDirection: "column" }}>
      {users.map(user => (
        <h1>{user.name}</h1>
      ))}
    </div>
  );
};

export default Users;

import React，{useState，useffect}来自“React”；
常量用户=（）=>{
const[users，setUsers]=useState（[]）；
useffect（（）=>{
fetchData（）；
}, []);
异步函数fetchData（）{
常量url=`https://jsonplaceholder.typicode.com/users`;
const response=等待获取（url{
方法：“获取”，
模式：“cors”
});
const data=wait response.json（）；
设置用户（数据）；
}
返回(
{users.map（user=>(
{user.name}
))}
);
};
导出默认用户；

如果有帮助，请告诉我。
工作示例

另外，不要在渲染中调用
fetchData（）
，因为它会导致无限请求

工作守则：

const Users = () => {
    const [users, setUsers] = useState([]);
    useEffect(() => {
        fetchData();
        console.log('effect')
    }, []);

    const fetchData = async () => {
        const url = `https://jsonplaceholder.typicode.com/users`;
        const response = await fetch(url, {
                method: 'GET', // *GET, POST, PUT, DELETE, etc.
                mode: 'cors', // no-cors, *cors, same-origin
            }
        );
        const data = await response.json();
      setUsers(data)
    };

    return (
        <div>
        Response: {users.map(item=>`${item.name}, `)}
        </div>
    );
}; 

const Users=（）=>{
const[users，setUsers]=useState（[]）；
useffect（（）=>{
fetchData（）；
console.log（'effect'））
}, []);
const fetchData=async（）=>{
常量url=`https://jsonplaceholder.typicode.com/users`;
const response=等待获取（url{
方法：'GET'、//*GET、POST、PUT、DELETE等。
模式：'cors'，//无cors，*cors，同一来源
}
);
const data=wait response.json（）；
设置用户（数据）
};
返回(
响应：{users.map（item=>`${item.name}，`}
);
}; 
因为服务器返回503=服务不可用错误