layAdmin页面跳转定时器不销毁

最近在用layAdmin做项目时，遇到了一个问题：layAdmin页面跳转定时器不销毁。具体看下面的代码：

layui.define(function(exports){

    // 定义了一个定时器
    let timer = setInterval(()=>{
        console.log(1)
    }, 1000)

    //对外暴露的接口
    exports('common', {});
});

然后在跳转页面后，发现这个console仍然在执行。当再次跳转回来，发现时间变快了。也就是说，这个定时器并没有随着页面的跳转，而销毁。不像vue。于是，在官网找有没有监听路由跳转、页面生命周期等的相关方法，发现一无所获。可能layuiAdmin真的没有提供此类方法（我这是layuiAdmin.pro-v1.1.0，为了兼容IE8，只能用它了，新版本不知道）。那么只能自己解决了：

方法一：因为我爱模板网用的是单页面的layuiAdmin，所以只要监听hash变化，清除定时器即可：

layui.define(function(exports){

    // hash路由改变，清除定时器，这个也可以放在公共js里面，或者放在入口js内。
    window.onhashchange = function(){
        if(window.timer || window.timer === 0){
            clearInterval(window.timer)
        }
    }

    // 定义了一个定时器
    window.timer = setInterval(()=>{
        console.log(1)
    }, 1000)

    //对外暴露的接口
    exports('common', {});
});

方法二和方法一差不多，只不过不做监听了，调用定时器之前就清楚它：

layui.define(function(exports){

    if(window.timer || window.timer === 0){
        clearInterval(window.timer)
    }

    // 定义了一个定时器
    window.timer = setInterval(()=>{
        console.log(1)
    }, 1000)

    //对外暴露的接口
    exports('common', {});
});

部分素材资源来源网站，本站提供免费下载，如有侵权请联系站长马上删除！