Question

在用户离开我的网页或浏览器时,我需要发送一些数据。哪些事件应当使用? 我正在使用反应堆和轴心,或许可以采取某种办法。

我试图使用卸载、卸载和上载,但定期工作。有时它发送数据,但当我试图再次这样做时,它就没有工作。而且,我不需要一个登峰/标签表格,该表要求用户确认填写表格,以显示该页即将关闭。

Answer 1

我认为,当用户离开你的网页或关闭浏览器时,你想要发送数据时,<代码>在<<>unload>之前即为一种常用的方法。

Using beforeunload event can trigger a confirmation dialog in some browsers, and there s no guaranteed time for the network request to complete.

One alternative is to use the unload event, which is fired just before the page is unloaded. Keep in mind that, similar to beforeunload, the unload event is also limited in terms of reliability for sending data.

添加使用<代码>unload的样本代码:

import React, { useEffect } from  react ;
import axios from  axios ;

const MyComponent = () => {
  useEffect(() => {
    const cleanup = async () => {
      try {
        await axios.post( your-api-endpoint , { yourData });
      } catch (error) {
        console.error( Error sending data on unload: , error);
      }
    };

    window.addEventListener( unload , cleanup);

    return () => {
      cleanup();
      window.removeEventListener( unload , cleanup);
    };
  }, []);

  return (
    <div>
      {/* Your component content */}
    </div>
  );
};

export default MyComponent;

友情链接