React 定时刷新接口

// 通过 useEffect 在页面加载时调用 getNodeDetailList();列表接口
useEffect(() => {
    getNodeDetailList();
  }, [change]);

// 然后通过 setInterval 来进行定时刷新
useEffect(() => {
  const timer = setInterval(() => {
    getNodeDetailList();
  }, 30000);
  return () => clearInterval(timer);
}, []);

还有一种是在页面添加一个倒计时的提示效果:

// 每30秒刷新一次接口,并实现倒计时
  const [count, setCount] = useState(30); // 30秒刷新一次
  useEffect(() => {
    const timer = setInterval(() => {
      setCount(count - 1);
    }, 1000); // 每一秒,count减1
    if (count === 0) { // 当count等于0时,调用列表接口方法
      setCount(30); // 重新赋值30秒
      getNodeDetailList();
    }
    return () => clearInterval(timer);
  }, [count]);


 // 页面展示 
 <span style={
   
   { marginLeft: 10 }}>刷新倒计时：{count}</span>