keep-alive 触发onUnmounted

Keep-alive是一种前端优化技术，用于保留组件的状态，在用户短暂离开页面后再返回时能快速恢复，避免不必要的重新渲染。React中通过`useEffect`和`React.PureComponent`配合`shouldComponentUpdate`或`React.memo`来实现代理式keep-alive。

当组件被挂起（例如路由切换），但是由于存在某种触发条件，比如用户长时间未操作或者服务器发送了新的数据，你想让这个组件继续保持激活状态并监听某些事件（如网络请求完成），这时可以在`useEffect`钩子里设置一个`onUnmounted`回调函数，该函数会在组件卸载前执行。例如：

import React, { useEffect } from 'react';

function MyComponent({ onUnmount }) {
  useEffect(() => {
    // 设置一个计时器，如果超过某个时间限制还没触发卸载，就取消它
    const timeoutId = setTimeout(() => {
      if (!onUnmount.current) return;
      onUnmount.current();
      clearTimeout(timeoutId);
    }, 5000); // 假设我们想要5秒后检查是否需要关闭

    return () => {
      // 清除计时器，防止内存泄漏
      clearTimeout(timeoutId);
      onUnmount.current = null; // 确保每次更新都会清除上一次设置的引用
    };
  }, [onUnmount]);

  // ...其他组件内容...
}

在这个例子中，`onUnmount`是一个由外部传入的prop，会在组件卸载时被调用。当你希望在特定条件下触发组件卸载时（如API请求完成），可以手动调用这个函数。