vue-router组件间参数相互传递的方法

这次给大家带来vue-router组件间参数相互传递的方法，vue-router组件参数相互传递的注意事项有哪些，下面就是实战案例，一起来看一下。

通过VueRouter来实现组件之间的跳转：参数的传递，具体内容如下

login ---用户名--->main

①明确发送方和接收方

②配置接收方的路由地址
{path:'/myTest',component:TestComponent}
-->
{path:'/myTest/:id',component:TestComponent}

③接收方获取传递来的数据
this.$route.params.id

④跳转的时候，发送参数
this.$router.push('/myTest/20')
跳转

代码：

 
 
 
 
 
 

 
 

  
{{msg}}
  
  
 

 
 

 
 
 
 
 
 

 
 

  
{{msg}}

  
 

 
 

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：

mint-ui loadmore上拉加载与下拉刷新冲突处理方法

微信小程序怎样使图片上传至服务器

以上是vue-router组件间参数相互传递的方法的详细内容。更多信息请关注PHP中文网其他相关文章！