我是靠谱客的博主 温婉奇异果,最近开发中收集的这篇文章主要介绍Vue路由添加公共参数Vue路由添加公共参数,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

Vue路由添加公共参数

如Vue-Router介绍所说,router.beforeEach是路由跳转前的钩子,需要增加公共参数可以在这里处理。

In that case, you must call next exactly once in any given pass through a navigation guard.

router.beforeEach中第三个参数next,必须在每一种给定的导航中严格执行一次。

执行分两种情况

  • next(),这种情况不再执行前置钩子
  • next('/'),这种情况会执行前置钩子

所以钩子中必须包含next(),否则将进入死循环。

添加公共参数

router.beforeEach(to, from, next){
    //to是即将跳转的路由
    //from是跳转前的路由
    //公共参数以commonId为例
    if (!to.query.commonId) {
        //如果目标路由没有公共参数,就获取公共参数并添加
        let commonId = from.query.commonId 
        if (commonId) {
            //如果公共参数不为空,则塞进目标路由中
            to.query.commonId = commonId
            next({
                to: to.name,
                query: to.query
            })
        } else {
            next()
        }
   	} else {
        next()
    }
}

最后

以上就是温婉奇异果为你收集整理的Vue路由添加公共参数Vue路由添加公共参数的全部内容,希望文章能够帮你解决Vue路由添加公共参数Vue路由添加公共参数所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(54)

评论列表共有 0 条评论

立即
投稿
返回
顶部