There is a timer on the current page, and the timer is cleared when leaving the page
beforeDestroy() {
if () {
clearInterval()
= null
}
},reason
The timer for the current page (assuming the current page is page1) is fired after a series of pre-requests. [There is a bunch of requests in front of this timer. The timer will be triggered after the stack of requests is completed]
When the route switches too fast, when switching to other pages (page2, page3...), the beforeDestroy function of the current page (page1) has been triggered, but the timer of the current page (page1) has not been triggered yet. When switching to another page (page2, page3...), the timer of the current page (page1) is executed.
In this case, the timer cannot be cleared
Solution: When executing the timer, just add a judgment
Determines whether the route is the route name of the current page1. If it is the current route name, the timer will start executing
If the route name of page1 is [page1]
This is the way vue2 and vue3 are both the same
if (this.$ === 'page1') {
= setInterval(() => {
()
}, 3 * 1000)
}Supplement: Timer clearing problem in front-end Vue project
Method 1: Regular use and clearance
clearInterval()//Clear the timer before use = setInterval(()=>{
(1)
}, 1000)
Method 2: Use an array to store the identity of each timer to avoid some reasons that the timer cannot be cleared (such as: the page is repeatedly initialized)
if(!){ = []}
// Clear the saved timer together(item=>{
clearInterval(item)
})
const timerId = setInterval(()=>{
(1)
}, 1000)
(timerId)This is the article about the reasons why timers cannot be cleared in vue projects. This is all about this article. For more related contents of vue timers that cannot be cleared, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!