页面刷新时，如何在 onMounted 中获取当前路由？

在Vue.js中，使用Vue Router时，如果你想在组件的onMounted生命周期钩子中获取当前的路由信息，可以通过访问this.$route来实现，它会提供当前路由的所有信息，如路径、查询参数等。

以下是一个具体的示例，说明如何在Vue 3中的组件内的onMounted钩子中获取路由信息：

javascript
<template>
  <div>
    <h1>当前页面路径是: {{ currentPath }}</h1>
  </div>
</template>

<script>
import { onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'

export default {
  setup() {
    const currentPath = ref('')
    const route = useRoute()

    onMounted(() => {
      // 获取当前路由路径
      currentPath.value = route.path
      console.log('当前路由对象:', route)
    })

    return {
      currentPath
    }
  }
}
</script>

在这个例子中，我使用了Vue 3的Composition API。setup函数是一个新的组件选项，用于使用组合式API。通过useRoute这个Router提供的钩子函数，我们可以在任何组件内部获取当前的路由对象。然后在onMounted内部，我们可以访问route.path来获取当前的路径，并使用一个响应式引用currentPath来存储这个值，从而在模板中显示当前的页面路径。

这样，每次页面刷新时，组件挂载完成后，都会在控制台中打印出当前的路由信息，并更新页面中显示的路径信息。这对于需要根据路由变化来调整UI或执行其他逻辑的场景非常有用。