我试图每5分钟发送一次操作。一旦用户登录，它必须调度动作。它将每隔5分钟开始调度动作。我尝试使用，setInterval但是这里的问题是即使我注销，它仍会继续执行调度操作。
这是我的代码，我已在我的app.js中定义了keepAlive函数，将整个应用程序包装到redux存储中。这isAuthenticated是布尔函数。如果isAuthenticated为true并且仅API.getAcessToken在localstorage那时可用，则我想调度操作。
function keepAlive() {
if (
props.isAuthenticated === true &&
API.getAccessTokenFromLocalStorage()
) {
setInterval(() => {
props.keepTokenAlive();
}, 100000); // 1000ms =1sec
} else {
return null;
}
}
keepAlive();
您可以创建一个自定义的React钩子。有一些库可以解决此问题，但是所涉及的代码很小，您可以自己这样做。
例如，这是use-interval NPM包中的源代码：
import { useEffect, useRef } from 'react';
const useInterval = (callback, delay) => {
const savedCallback = useRef();
useEffect(
() => {
savedCallback.current = callback;
},
[callback]
);
useEffect(
() => {
const handler = (...args) => savedCallback.current(...args);
if (delay !== null) {
const id = setInterval(handler, delay);
return () => clearInterval(id);
}
},
[delay]
);
};
export default useInterval;
您可以这样使用它：
const MyComponent = () => {
useInterval(() => {
// your code here
}, 5000);
return null
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句