vue 返回指定页面

提供一种解决方案:

  • beforeRouteLeave (组件内的守卫)

通过某种方式,进入页面B ( 如详情页 ),返回时需跳转到 页面A ( 如首页 ),在 B 页面中添加 守卫钩子:

beforeRouteLeave (to, from, next) {
// 通过地址查询是否带有跳转标示 let backHome
= this.$route.query.backhome
// 有标示 且 要跳转的路由不等于 A 页面时设定即将跳转的路由;否则继续跳转原导航路由
if(backHome == 'backhome' && to.name !='Home'){ next('/news') }else{ next() } },

此处的 if else ,比较容易失误,从而导致进入深循环!

 

续:

业务中有特殊场景,通过 触发页面X 进入到 B 页面时,需打开一个新的窗口或 webview,此时新打开的窗口只有一条记录,返回的时候会直接关闭窗口( webview中 ),这样就得另换一种思路,走中间页面。

页面跳转链接设为A页面,并在链接中添加跳转标示,到 A 页面后判断是否存在此标示,存在的话先替换地址,再跳转。如果觉得在 A页面的短暂停留碍眼,也可以用加载图或者直接白屏掩盖

// 检查标示
let topage = this.$route.query.topage if(topage) {
// 替换地址,去掉标示
this.$router.replace({name:'Home'})
// 跳转到页面 B
this.$router.push({name: 'Page', params: { id: topage }},()=>{
// 去掉加载loading
this.ifRedirect = true }) }else{
// 去掉加载loading
this.ifRedirect = true }

 

posted @ 2018-12-25 11:09  晨の风  阅读(6511)  评论(0编辑  收藏  举报