定時器如果不手動清除,只會在離開當前頁面或者F5刷新后才會清除。由於vue項目是SPA應用,離開當前組件后並不會清除定時器,所以需要我們手動去清除定時器。但當我們將清除定時器clearInterval或clearTimeout寫入組件的生命周期destroyed內部時並不能清除定時器,直接寫window.clearXXX也並不是很好使。網上查了好久,有前輩給出需要將清除定時器寫在路由鈎子函數里,注意這里的路由函數需要寫在當前組件下。下面給代碼:
這里注意我是使用setTimeout內調用setTimeout來實現setInterval的效果(好處自己百度去)。紅色框的變量不用管等會再說。上面是定時器的代碼,下面給出離開組件時清除定時器的代碼
這里的isDestroyed變量在離開組件前設為true,清除定時器。