vue3在自定义hooks中使用userRoute结果为undefined,如何在自定义hooks中使用userRoute

vue3.0中在setup中使用路由import { defineComponent } from 'vue'import { useRoute, useRouter } from "vue-router"export default defineComponent({const route = useRoute()const router = useRouter()console.log(rou

Lucky_girl_wan

7331人浏览 · 2021-09-09 12:59:38

Lucky_girl_wan · 2021-09-09 12:59:38 发布

vue3.0中在setup中使用路由

import { defineComponent } from 'vue'
import { useRoute, useRouter } from "vue-router"


export default defineComponent({
     const route = useRoute()
     const router = useRouter()

     console.log(route.query.id)
     router.push({ path:'/task/rule', query: { id } })
})

useRoute, useRouter必须写到setup中，若强行写在hooks函数中就会undefined，获取不到对应的方法，但是想要在自定义的hooks中使用路由方法如下：

import Vrouter from "@/router"


const route = Vrouter.currentRoute.value
const router = Vrouter

监测当前路由同理：注意不要直接监测整个router对象

watch(() => Vrouter.currentRoute.value.query,
    (query) => {
      ListParams.value = Object.assign(params,query)
      res.value = handleParams()
    })