vue中进入页面触发的方法

在 Vue 中，可以使用 `mounted` 钩子函数来在组件挂载到 DOM 上后触发相应的方法。`mounted` 钩子函数会在组件挂载后立即被调用，因此可以在这个钩子函数中进行数据初始化、DOM 操作等工作。例如：

<template>
  <div>
    <h1>{{ message }}</h1>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: ''
    }
  },
  mounted() {
    // 在组件挂载后，通过异步请求数据并更新 message
    fetchData().then(data => {
      this.message = data
    })
  }
}
</script>

当组件挂载后，`mounted` 钩子函数会被调用，从而触发异步请求数据的方法，然后将数据更新到组件的 `message` 中，最终渲染到 DOM 上。

相关问题

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()` 方法来继续执行下一个守卫或者完成导航。

vue离开当前页面时触发

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

示例代码：

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

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