首先简单来说明一下: router和route的区别
router : 是路由操作对象,只写对象,route : 路由信息对象,只读对象
//操作 路由跳转
this.$router.push({
name:'hello',
params:{
name:'word',
age:'11'
}
})
//读取 路由参数接收
this.name = this.$route.params.name;
this.age = this.$route.params.age;
1·跳转方式:query传参,使用name,path跳转;params只能用name跳转
//query传参,使用name跳转
this.$router.push({
name:'second',
query: {
queryId:'20180822',
queryName: 'query'
}
})
//query传参,使用path跳转
this.$router.push({
path:'second',
query: {
queryId:'20180822',
queryName: 'query'
}
})
//params传参 使用name
this.$router.push({
name:'second',
params: {
id:'20180822',
name: 'query'
}
})
2.接收参数
//query传参接收
this.queryName = this.$route.query.queryName;
this.queryId = this.$route.query.queryId;
//params接收参数
this.id = this.$route.params.id ;
this.name = this.$route.params.name ;
3.路由
//query
{
path: '/second',
name: 'second',
component: () => import('@/view/second')
}
//params
{
path: '/second/:id/:name',
name: 'second',
component: () => import('@/view/second')
}
或者
//刷新后得不到数据,不建议使用
{
path: '/second',
name: 'second',
component: () => import('@/view/second')
}
网友评论