Vue3Vue-Router4.x 实现路由跳转传参

Posted 嘻嘻的妙妙屋

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue3Vue-Router4.x 实现路由跳转传参相关的知识,希望对你有一定的参考价值。

传递参数

<script>
  import 
    useRouter
   from "vue-router";
  export default 
    setup() 
      const router = useRouter()
      const methods = 
        goMain() 
          router.push(
            path: "/main",
            query: 
              id: 123
            
          )
        
      
      return 
        ...methods
      ;
    ,
  ;
</script>

接收参数

<script>
  import 
    onMounted
   from "vue";
  import 
    useRoute
   from "vue-router";
  export default 
    setup() 
      const route = useRoute()
      onMounted(() => 
        console.log(route.query.id)
      )
    
  
</script>

以上是关于Vue3Vue-Router4.x 实现路由跳转传参的主要内容,如果未能解决你的问题,请参考以下文章

vue 路由跳转传参

ionic5 路由跳转跳转传值返回上一页返回到根

vue中组件3种编程式路由跳转传参

Angular-路由:路由的定义跳转传值

Angular2 路由跳转与传参

vue路由传值