Vue3路由参数获取方式

方法一：通过引入 “vue-router” 的 useRouterimport { useRouter, onMounted } from 'vue-router'setup (props, context) {const router = useRouter();onMounted(() => {// 打印console.log('router:', router.currentRoute

文章共139字 · 阅读需要大约1分钟

一键AI生成摘要，助你高效阅读

问答

酷画册二维码生成

21842人浏览 · 2022-05-25 08:39:14

酷画册二维码生成 · 2022-05-25 08:39:14 发布

方法一：通过引入 “vue-router” 的 useRouter

import { useRouter, onMounted } from 'vue-router'
 
setup (props, context) {
  const router = useRouter();
  onMounted(() => {
    // 打印
    console.log('router:', router.currentRoute.value.query)
  })
  return {}
}

方法二：通过引入 “vue-router” 的 userRoute

import { useRoute, onMounted, toRaw } from 'vue-router'
 
setup (props, context) {
  const route = useRoute();
  onMounted(() => {
    // 打印
    console.log('route:', toRaw(route).query.value)
  })
  return {}
}

useRouter 和 useRoute 函数不能在setup 里面的函数内执行，要放在顶部或者其他位置，不然作用域改变，执行后的 router/route 是 undefined