ht_hooks
Version:
ht React 业务 Hooks
32 lines • 1.5 kB
JavaScript
//!在页面重新聚焦(用户切回页面)时,自动重新请求(refresh),可以设置最小时间间隔,避免切换太频繁导致重复请求。
import { useEffect, useRef } from 'react';
import useUnmount from '../../../useUnmount';
import limit from '../utils/limit';
import subscribeFocus from '../utils/subscribeFocus';
var useRefreshOnWindowFocusPlugin = function (fetchInstance, _a) {
var refreshOnWindowFocus = _a.refreshOnWindowFocus,
_b = _a.focusTimespan,
focusTimespan = _b === void 0 ? 5000 : _b;
var unsubscribeRef = useRef();
var stopSubscribe = function () {
var _a;
(_a = unsubscribeRef.current) === null || _a === void 0 ? void 0 : _a.call(unsubscribeRef);
};
useEffect(function () {
if (refreshOnWindowFocus) {
//当配置了 refreshOnWindowFocus: true 时,才启用页面聚焦自动刷新功能。
var limitRefresh_1 = limit(fetchInstance.refresh.bind(fetchInstance), focusTimespan); //#用 limit() 包裹 refresh(),控制在 focusTimespan 时间内只允许刷新一次,防止频繁切换窗口疯狂触发。
unsubscribeRef.current = subscribeFocus(function () {
limitRefresh_1(); //!订阅窗口聚焦事件,每次聚焦就调用 limitRefresh()即refresh重新请求
});
}
return function () {
stopSubscribe();
};
}, [refreshOnWindowFocus, focusTimespan]);
useUnmount(function () {
stopSubscribe();
});
return {};
};
export default useRefreshOnWindowFocusPlugin;