背景

以前做ADTS项目的时候，首页是实时监控页面，需要每5秒更新一次数据。但是在业务逻辑中，需要先请求告警列表的接口，从告警列表中获取数据，再获取其他数据，所以我在获取告警列表的方法中加入了定时器。

起初，我在组件内部声明了计时器(因为页面不多，数据关联不强，所以项目中不使用存储进行数据管理)。后来我清除的时候发现清除不了。后来我干脆在窗下声明了。然后在组件内部编写以下代码：

我发现我无法清除计时器。后来去调试，发现完全没有进入这个方法。然后我问同事有没有遇到类似的问题。

解决

后来同事建议我把路由出发事件的代码放到配置了路由的接口中。我试了一下，成功了，计时器成功清零。

摘要

vue的BeforeRouteEnter和beforeRouteLeave必须写入配置了路由的接口中，写入接口调用的组件时不能触发。

如果vue不用store，定时器可以直接在window下声明，方便清零。

以上vue路由事件beforeRouteLeave和组件中定时器的清除方法都是边肖分享的内容，希望能给大家一个参考和支持。