Por exemplo, se você definir um cronômetro quando a página for montada, precisará limpar o cronômetro quando a página for destruída. Isso parece bom. Mas um olhar mais atento para a única função deste.timer é ser capaz de obter o número de série do timer em beforeDestroy, caso contrário não tem utilidade.
export default {
mounted() {
this.timer = setInterval(() => {
console.log(Date.now())
}, 1000)
},
beforeDestroy() {
clearInterval(this.timer)
}
}
É melhor se apenas os ganchos do ciclo de vida puderem acessá-lo. Este não é um problema sério, mas pode ser considerado uma desordem.
Podemos resolver esse problema ouvindo a destruição do ciclo de vida da página com $on ou $once. Você também pode criar várias vidas em
função periódica.
export default {
mounted() {
this.creatInterval('hello')
this.creatInterval('world')
},
creatInterval(msg) {
let timer = setInterval(() => {
console.log(msg)
}, 1000)
this.$once('hook:beforeDestroy', function() {
clearInterval(timer)
})
}
}
Mesmo se criarmos vários temporizadores ao mesmo tempo, isso não afetará o efeito. Porque eles são automaticamente apagados programaticamente depois que a página é destruída.