vue离开当前页面时触发和进入当前页面时触发

当 Vue 组件进入当前页面时，可以使用 `beforeRouteEnter` 守卫来触发相应的操作。这个守卫会在当前组件被激活时被调用，可以在这里执行一些初始化操作或者加载数据等操作。

示例代码：

export default {
  name: 'MyComponent',
  beforeRouteEnter (to, from, next) {
    // 在这里执行初始化操作或者加载数据等操作
    next()
  }
}

在这个示例代码中，`beforeRouteEnter`守卫会在组件被激活时被调用，你可以在这里实现你的操作。在这个守卫中，你无法访问组件实例 `this`，但是可以通过传入回调函数的方式来访问组件实例。最后，你需要调用 `next()` 方法来继续执行下一个守卫或者完成导航。

同时，当 Vue 组件离开当前页面时，可以使用 `beforeRouteLeave` 守卫来触发相应的操作。这个守卫会在当前组件即将离开时被调用，可以在这里执行一些清理操作或者弹出提示框等操作。

示例代码：

export default {
  name: 'MyComponent',
  beforeRouteLeave (to, from, next) {
    // 在这里执行清理操作或者弹出提示框等操作
    next()
  }
}

在这个示例代码中，`beforeRouteLeave` 守卫会在组件即将离开时被调用，你可以在这里实现你的操作。在这个守卫中，你可以访问 `to` 和 `from` 对象，它们分别代表即将进入的路由和即将离开的路由。最后，你需要调用 `next()` 方法来继续执行下一个守卫或者完成导航。