Vue入门(六)—— 路由转跳
路由转跳的方法有两种:1.编程式在方法中调用// 转跳至/homethis.$router.push('/home')// 前进一步this.$router.go(1)// 后退一步this.$router.go(-1)// 跳转至/user,不保留历史记录this.$router.replace{path:'/user'}// 转跳并传参,相当于post请求,页面跳转时参数...
·
路由转跳的方法有两种:
1.编程式
在方法中调用
// 转跳至/home
this.$router.push('/home')
// 前进一步
this.$router.go(1)
// 后退一步
this.$router.go(-1)
// 跳转至/user,不保留历史记录
this.$router.replace('/user')
// 转跳并传参,相当于post请求,页面跳转时参数不会在地址栏中显示,通过this.$route.params.id获取
this.$router.push({
path:'/user',
params:{
id:this.id
}
})
// 转跳并传参,相当于get请求,页面跳转时参数会在地址栏中显示,通过this.$route.query.id获取
this.$router.push({
path:'/user',
query:{
id:this.id
}
})
2.声明式
// 转跳不传参
<router-link to="home">链接</router-link>
// 转跳传参
<router-link :to="'/user/' + this.id"> <router-link/>
// 传参的路由需要配置为
path: '/user/:id'
// 接收参数的方法为
this.$route.params.id
更多推荐
已为社区贡献9条内容
所有评论(0)