繁体   English   中英

无法在回调内部调用React Hook“ useInterval”

[英]React Hook “useInterval” cannot be called inside a callback

我正在尝试为可能需要一段时间才能完成的后端操作设置进度条。

  1. 用户单击按钮以导出文件
  2. API响应具有后端流程的令牌
  3. 使用useInterval,我每隔半秒检查进度%(使用另一个端点,发送令牌)以更新进度条组件

我简化了Codesandbox中的代码以重现此问题,在Codesandbox中,单击按钮时,我运行useInterval每隔4秒获取一张新的随机猫图片并更新我的钩子。

Codesandbox

据我了解,问题是因为我在自定义的Hook(useInterval)中调用了Hook,但是我不知道另一种方法,因为本机setInterval无法与Hook一起使用。

我使用了use-interval

您不必包装useIntervaluseEffect 内部 useInterval调用useEffect可以正常工作。

您可以更改组件中传递给useInterval值,新值将正确应用。 您可以更改延迟或回调参数,并且useInterval将应用它们。

为了展示,我添加了停止按钮,该按钮停止检索猫。

这是猫的工作解决方案 :-)

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM