时间戳

首页 > 解决方案 > setTimeout in useEffect

javascript - setTimeout in useEffect

问题描述

我正在尝试更改 setTimeout 和 useEffect 中元素的样式。

这是代码的样子

In home.js: 
useEffect(()=>{
    setTimeout(()=>{
        // change styles  for 'frontenddevelopment'
        changeStyles1();
    },1000)

    // changeStyles for 'i love frontend'
    changeStyles2()
},[])

我发现在主页渲染后，如果我导航到其他页面并返回主页，将再次调用 changesStyles1() 并且动画将再次运行。当我从其他页面导航回主页时，我应该怎么做才能避免再次调用 setTimeout()。

如果我从主页导航到其他页面然后返回主页，您会注意到 changeStyle2 不会再次动画。这就是我想要的效果。

我的网站托管在netlify 我的代码在codepen

标签： javascriptreactjssettimeoutuse-effect

解决方案

推荐阅读