【Vue3】Vue-Router4.x 实现路由跳转传参

最新推荐文章于 2024-04-15 11:12:07 发布

嘻嘻的妙妙屋

最新推荐文章于 2024-04-15 11:12:07 发布

阅读量963

点赞数

分类专栏：前端文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/Jessieeeeeee/article/details/122497005

版权

前端专栏收录该内容

77 篇文章 3 订阅

订阅专栏

传递参数

<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>