第一种:query传参
query带参跳转相当于是get提交,跳转页面后参数会显示在导航栏中。
//跳转
this.$router.push({
path:'/page',
query:{name1:'1',name2:'2'}
});
//接收
var name1 = this.$route.query.name1;
var name2 = this.$route.query.name2;
//router.js里面
const routes = [{
path: '/page',
name: '/page',
component: () => import('../components/Page.vue')
}
]
第二种:params传参
params传参相当于是post提交,传递的参数不会显示在导航栏,但跳转页面后刷新页面的话,参数会丢失,而query传参则不会。
//跳转
this.$router.push({
name:'/page',
params:{name1:'1',name2:'2'}
});
//接收
var name1 = this.$route.params.name1;
var name2 = this.$route.params.name2;
//router.js里面
const routes = [{
path: '/page',
name: '/page',
component: () => import('../components/Page.vue')
}
]