LQ博客 www.lqblogs.com
arrows
nav

谈浏览器返回时beforeRouteLeave路由守卫不使用next()方法的影响

作者:LQ 来源:原创 发布时间:2020-01-04 浏览量:6252 评论:0 点赞:2

浏览器返回时beforeRouteLeave使用与不使用next()方法的区别

 beforeRouteLeave路由守卫不使用next()方法,点击返回的时候,URL会变为上一层的URL,但页面内容不会切换到上一层,还停留在当前页面。

使用next()方法,离开页面的时候,URL会变为上一层的URL,页面内容也会切换到上一层并刷新上一层页面。

next()方法和location.reload()方法都属于异步方法

大家可以用alert()弹框做拦截测试下

beforeRouteLeave(to, form, next){
    //location.reload();
    next();
    alert('test')
}

浏览器返回时next()方法替代方案

可以用location.reload()方法替代,location.reload()方法实现重新加载当前URL

beforeRouteLeave(to, form, next){
    if(this.isNext){//isNext[true, false]
     location.reload();
    }else{
     next();
    }
  }

注意:以上结论,只适合VUE附带query传参或不附带任何传参场景使用,不适合在VUE附带params传参的场景使用,无论是next()方法刷新,还是location.reload()方法重载都会导致params传参丢失!

location beforeRouteLeave Vue
如果你感觉本文章对你有帮助的话,那就点赞、打赏或订阅一下吧
点赞(2)
打赏
倒踩(0)
关闭 感谢您的支持,我会继续努力
微信支付
支付宝支付
扫码打赏,建议金额1-20元
浏览量(6252)
讨论本篇文章(0)
发表评论

最多访问文章

最新文章