setInterval的使用

最近在自己的react项目中使用到了setInterval，不过由于种种原因出现很多bug，在这里总结一下

项目场景

点击一个开关后在间隔固定的时间段内连续发送请求，获取新的数据，关闭开关后就关闭定时器，不在发送请求，说到这里很多人大脑中应该都有了对应的解决方案了，我当时也是有自己的解决方案了，可是在实际写的过程中却遇到不少的问题

当时我是根据一个state状态来判断开启与关闭定时器，所以有了以下的代码

functions fn(){
    let a = undefined;
    if(this.state.isStart) {
        a = setInterVal(() => {
            // 数据请求 
            this.props.onDidMount();
        }, 30000);
    }else {
        clearInterVal(a);
    }  
}

复制代码

大致一看觉的没什么问题,调用方法时先给a初始化，然后判断，如果值为true则开启定时器，否则清楚定时器，但是这里有个问题，如果不为true，是会清理定时器，但是此时的a真的是需要清理的定时器么？也就是说每次清理的并不是定时器，是一个undefined，下面的代码就正常了

functions fn(){
    if(this.state.isStart) {
        window.a = setInterVal(() => {
            // 数据请求 
            this.props.onDidMount();
        }, 30000);
    }else {
        clearInterVal(window.a);
    }  
}
复制代码

这里不管怎么调用，每次清理的都是定时器，将a提升到了全局变量中

转载于:https://juejin.im/post/5ca217976fb9a05e444f2e55