金贵勇,中国一汽集团公司,西安市邮编
最近项目上需要用vue用来做app，在vue中使用路由时遇到下面的问题。
路由设置如下：
我要评论
{
path:'/tab',
component:tab,
children:[{
path:'layoutlist',
name:'layoutlist',
component:layoutlist
},{
path:'layoutview/:layoutid',
name:'layoutview',
component:layoutview
},{
path:'layoutdetail/:viewid',
name:'layoutdetail',
component:layoutdetail
}]
}
其中/tab是根地址，有3个子地址，3个子地址层级为：layoutlist => layoutview => layoutdetail
正常情况：假设当前路由为/tab/layoutlist，需要跳转到layoutview页面，可以通过router.push({path:'layoutview/'+item.id})
跳转后的路由为/tab/layoutview/1
当我想从layoutview页面跳转到对应的layoutdetail页面时：
情况一：（找不到页面）
跳转前地址：/tab/layoutview/1
跳转代码：router.push({path:'layoutdetail/'+item.id});
跳转后地址：/tab/layoutview/layoutdetail/27
情况二：（找不到页面）
跳转前地址：/tab/layoutview/1
跳转代码：router.push({path:'/layoutdetail/'+item.id});
跳转后地址：/layoutdetail/27
情况三：（找不到页面）
跳转前地址：/tab/layoutview/1
跳转代码：router.push({path:'tab/layoutdetail/'+item.id});
跳转后地址：/tab/layoutview/tab/layoutdetail/27
情况四：（页面正常显示）
跳转前地址：/tab/layoutview/1
跳转代码：router.push({path:'/tab/layoutdetail/'+item.id});
跳转后地址：/tab/layoutdetail/27
只有按照情况四的操作，才能正常显示出来页面。
vue路由会根据push的地址，如果地址不是/开头，会直接替换当前路由的最后一个/后的地址，
如果地址是/开头，会以push的地址作为绝对地址进行跳转。
另外我尝试还使用router.go({name:'layoutdetail',params:{viewid:item.id}})，页面不会跳转且地址也不会改变。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。
如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复
详解element上传组件before-remove钩子问题解决
vue.js中使用微信扫一扫解决invalid signature问题(完美解决)
网友评论