路由传值及获取参数,路由跳转

Posted 2022-02-02 shy1766it

配置动态路由参数id：

routes: [

        // 动态路径参数 以冒号开头

        path: ‘/user/:id‘, component: User

      ]

html路由跳转：

<router-link to="/demo53/8">路径参数跳转</router-link>

带问号参数跳转（两种写法）：

写法一：<router-link to="/demo53?id=8">跳转</router-link>

写法二：<router-link :to="path:‘/demo53‘, query:id:999">带问号跳转</router-link>

Js不带问题参数路由跳转：

this.$router.push( path: "/demo53/495" );

this.$router.push(name:‘demo53‘,params:id:9898);

Js带问题参数路由跳转：

this.$router.push( path: "/demo53?id=8" );

this.$router.push(name:‘demo53‘,params:id:9898);

获取参数：

获取不带问号的参数方式：this.$route.params

获取带问号的参数方式：this.$route.query

 

component: () => import(‘@/views/dataService/dataServiceAdmin/addDataService.vue‘)

 

 

https://blog.csdn.net/zjl199303/article/details/82655576 vue 配置路由 + 用户权限生成动态路由 踩过的那些坑
https://blog.csdn.net/sangjinchao/article/details/70888259 vue,router-link传参以及参数的使用
https://blog.csdn.net/wojiaomaxiaoqi/article/details/80688911 vue中this.$router.push路由传参以及获取方法