路由传参#
查询字符串参数(queryString)#
/user?id=123
1.定义路由规则#
1const routes = [
2 {
3 path: '/user',
4 name: 'user', // 对路由进行命名
5 component: () => import(/* webpackChunkName: "user" */ '../views/User.vue')
6 },
7]2.路由传参#
1this.$router.push("/user?id=123")
2
3this.$router.push({
4 path:'/user',
5 query: {
6 id:123
7 }
8})
9
10this.$router.push({
11 name:'user',
12 query: {
13 id:123
14 }
15})3.获取参数#
1this.$route.query.id路径信息参数(pathInfo)#
user/123
1.定义路由规则#
1const routes = [
2 {
3 path: '/user/:id',
4 name: 'user', // 对路由进行命名
5 component: () => import(/* webpackChunkName: "user" */ '../views/User.vue')
6 },
7]2.路由传参#
1this.$router.push("/user/123")
2
3this.$router.push({
4 name:'user',
5 params: {
6 id:123
7 }
8})
9
10// 注意：path不能与params搭配3.获取参数#
1this.$route.params.id目录