destoryed、beforeRouteLeave、afterEach三种响离开当前页面时的执行某个命令的区别

destoryed是当我们离开这个页面的时候，便会调用这个函数(具体可以看看vue的的生命周期)，我们常用来销毁一些监听事件及定时函数

// 销毁时调用的函数
destroyed() {
  this.function()
}

beforeRouteLeave是在页面离开时做的操作

//必须要有next()它相当于一个按钮触发默认触发跳转,next(false)是禁止页面跳转

//beforeRouteLeave和methods同级

//这块代码是说离开该路由前调用这个function函数然后在离开该页面

beforeRouteLeave(to,form,next){

this.function()

next()

}

 afterEach是路由守卫中的全局后置钩子

 router.afterEach((to, from) => {

console.log(to); //即将要进入的路由对象

console.log(from); //当前导航要离开的路由对象

this.function()//要执行的函数

 })
//afterEach函数不用传next()函数,但是beforeEach需要

这三个块代码都是想要离开页面执行function函数,但是destoryed和afterEach如果function函数内需要调取后台接口,他们两个都是数据返回之前就跳转了,不过如果是销毁一些监听,这三个函数差距不大,因此调用数据时候最好用beforeRouteLeave