VUE学习--路由跳转方式||路由跳转携带参数方式||目标路由接受参数方式


跳转方式1:.使用便签跳转, <router-link to="{path:'路由地址',params:{传的数据},query:{传的参数}" >;
跳转方式2:导航跳转,{
在路由内 (路由对象) router.push({
  path:'路径',//具有导航功能
  name:‘路由名称’,,//同样具有导航功能
  params:{传的数据},
  query:{传的参数}"
});
在组件内 (路由对象)this.$router.push(参数同上);

传参方式1:query:{传的参数}",会显示在url上,类似get请求传参,也可跟在path后面,目标路由获取方法:this.$route.query.id;
传参方式2:params:{传的参数}",不会显示在url上,类似post请求传参,不可跟在path后面,目标路由获取方法:this.$route.params.id;
注意:this.$route与this.$router的区别:
$route为当前router跳转对象里面可以获取name、path、query、params等;
$router为VueRouter实例,想要导航到不同URL,则使用$router.push方法;
前者用于‘获取传递的参数’,后者用于‘路由导航’;


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM