如何通过编程式导航传参
2023-12-29 20:10:17
1动态路由传参
this.$router. push( ' /article/2 ' )
组件获取参数: this. $route.params .id
规则:
{
path: '/article/ : id ' ,
component: ArticleDetail
},
组件使用
goArticleDetail ( ) {
//1.字符串形式
//this. $router. push('/ aiticle/2')
//2、对象形式 注意path不能与params一起使用
this.$router.push({path:'/article/5'})
}
2查询参数传参数
this. $router. push( ' / article?id=2 & name=zs' )
或写完整写法 this.$router.push(path:‘路径', query: {参数1:值,参数2:值,. . .}
路由规则path -> /路径 组件获取 this. $route.query.id
规则:
{
path: '/article ' ,
component: ArticleDetail
},
组件使用
goArticleDetail ( ) {
//1、字符串形式
this. $router. push('/ article?id=2')
}
完整写法
goArticleDetail ( ) {
//完整写法
this. $router. push({
//2、对象形式 path能与query一起使用
//path:'/ article?id=2'
path:'/article',
//查询参数
query:{
id:1
}
})
}
参数多写成对象的形式
文章来源:https://blog.csdn.net/m0_56713342/article/details/135296775
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!