javascript - 在 reactjs 中发出 HTTP 请求之前如何等待事件的互联网连接？

Question

我正在努力使我的 Reactjs 网络应用程序更加健壮。

我正在传递 HTTP 请求并等待响应。并且我的应用程序的用户在使用该应用程序时遇到困难，因为互联网连接不佳会不断断开连接，这会导致应用程序崩溃，因为 HTTP 请求无法通过或无法返回响应。

我正在努力寻找解决方案。

=> 我希望应用程序在传递 HTTP 请求之前等待互联网连接。

我已经了解如何使用 navigator.onLine; 检测互联网连接，但我不知道如何等到 navigator.onLine 为真以便我可以执行 HTTP 请求。

  await axios.post(`https://process.doc.com/v1/tea?key="API_KEY",  doc ).then(res=>{console.log(res)})

我想等待互联网连接执行 https 请求，但我找不到解决方案。

预期结果:WAITING事件互联网连接恢复，以便可以发出 https 请求。实际结果:互联网连接处于非事件状态，导致应用程序崩溃，因为 https 请求未正确发出

Answer 1

使用 React Hooks，您可以执行以下操作:

React.useEffect(() => {
  window.addEventListener('online', onLineCallBack);
  return () => window.removeEventListener("online", onLineCallBack);
}, []);