Question

出于某种原因，我在这里不作解释。我有一个react组件，每次完成渲染时都需要重新渲染，而不会超过最大渲染堆栈深度。

我尝试在useEffect侦听器中设置一些状态，以强制重新呈现组件，但该状态始终超出最大堆栈大小。

还有另一种方法吗？

Answer 1

我可能会做类似的事情：

const [time, setTime] = useState(Date.now());

useEffect(() => {
    let requestId;
    const update = () => {
        setTime(Date.now());
        requestId = window.requestAnimationFrame(update);
    }
    update();
    return () => {
        window.cancelAnimationFrame(requestID);
    };
}, []);

这样，您每次浏览器将要进行另一次重绘时都会触发更新（因此不是“立即”，而是会感觉到）。而且不会创建巨大的堆栈。

请注意，您不想在[]内部传递任何内容。如果您在括号中传递time，则意味着每次时间值改变时即运行效果，这不是我们想要的。它已经是一个“循环”，因此我们只需要在挂载时运行一次，然后在卸载组件时清除更新循环即可。

如何定期重新渲染反应组件

1 个答案: