如何接收Express在功能组件上发送的数据?

function Header(props) {  
  const [ serverData, setServerData ] = useState({});

  fetch('http://localhost:4001/api')
      .then(res => res.json())
      .then((data) => {
        setServerData(data);
        console.log(data);
      });

  return (
      <div>{serverData}</div>
  );
}

我正在尝试使此功能性React组件从Express API获取数据。

我的代码编辑器不断关闭,我认为接收数据的部分在循环中。

我如何使这个功能组件仅获取一次数据,而无需使用componentdidmount或类类型组件。

我尝试了useCallback,但它对我不起作用。