页面可见时如何重新运行useEffect？

在React中，当页面可见时重新运行useEffect，可以通过使用visibilitychange事件来实现。具体步骤如下：

在函数组件中，使用useEffect来监听visibilitychange事件。这个事件会在页面可见性发生变化时触发。
在useEffect的回调函数中，判断页面的可见性状态。可以通过document.visibilityState属性来获取页面的可见性状态，如果值为"visible"，表示页面当前可见。
在可见性状态为可见时，重新运行useEffect中的逻辑。

以下是一个示例代码：

import React, { useEffect } from 'react';

function MyComponent() {
  useEffect(() => {
    const handleVisibilityChange = () => {
      if (document.visibilityState === 'visible') {
        // 页面可见时重新运行useEffect中的逻辑
        // TODO: 添加你想要重新运行的代码
      }
    };

    document.addEventListener('visibilitychange', handleVisibilityChange);

    return () => {
      document.removeEventListener('visibilitychange', handleVisibilityChange);
    };
  }, []); // 这里的空数组表示只在组件挂载和卸载时运行一次

  // 其他组件逻辑
  return (
    // 组件内容
  );
}

export default MyComponent;

需要注意的是，以上示例代码只能在前端页面中使用，不适用于服务器端渲染。另外，如果你需要在页面不可见时清除useEffect中的副作用，可以在返回函数中进行清除操作。