资讯专栏INFORMATION COLUMN

vue 判断是否登录,未登录跳转到登录页

meteor199 / 1295人阅读

摘要:网页一进入判断是否登录,未登录跳转到登录页面首页是否需要判断是否登录这里是需要判断不需要鉴权判断该路由是否需要登录权限确保一定要有被调用

网页一进入判断是否登录,未登录跳转到登录页面

router.js
export default new Router({
  routes: [
    {
      path: "/",
      name: "HelloWorld",
      component: HelloWorld,
      meta: {
        title: "首页",
        type: "login"  // 是否需要判断是否登录,这里是需要判断
      }
    },
    {
      path: "/login",
      name: "login",
      component: login,
      meta: {
        title: "login",
        type: "" // 不需要鉴权
      }
    }
  ]
})
main.js
router.beforeEach((to, from, next) => {
  if (to.meta.title) {
    document.title = to.meta.title
  }
  const type = to.meta.type
  // 判断该路由是否需要登录权限
  if (type === "login") {
    if (window.localStorage.getItem("login")) {
      next()
    } else {
      next("/login")
    }
  } else {
    next()  // 确保一定要有next()被调用
  }
})

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/98949.html

相关文章

  • Vue中的验证登录状态

    摘要:用存储用户路由守卫路由中设置的字段就在当中每次跳转的路径登录状态下访问页面会跳到如果没有访问任何页面。一个简单的保存登录状态的小。 Vue项目中实现用户登录及token验证 先说一下我的实现步骤: 使用easy-mock新建登录接口,模拟用户数据 使用axios请求登录接口,匹配账号和密码 账号密码验证后, 拿到token,将token存储到sessionStorage中,并跳转到首...

    draveness 评论0 收藏0
  • VUE知识点集锦

    摘要:载入前后在阶段,实例的和都初始化了,但还是挂载之前为虚拟的节点,还未替换。类似于,不同在于提交的是,而不是直接变更状态可以包含任意异步操作。 vue基础 1、 router 路由与 a 标签的区别:https://www.jianshu.com/p/34b...2、 VUE双向绑定的原理: 答:VUE实现双向数据绑定的原理就是利用了 Object.defineProperty() 这个...

    Tecode 评论0 收藏0
  • VUE知识点集锦

    摘要:载入前后在阶段,实例的和都初始化了,但还是挂载之前为虚拟的节点,还未替换。类似于,不同在于提交的是,而不是直接变更状态可以包含任意异步操作。 vue基础 1、 router 路由与 a 标签的区别:https://www.jianshu.com/p/34b...2、 VUE双向绑定的原理: 答:VUE实现双向数据绑定的原理就是利用了 Object.defineProperty() 这个...

    APICloud 评论0 收藏0
  • 电商购物网站 - 登录和浏览

    摘要:添加商品页视图商品页视图用户登录成功之后则跳转至视图页面商品主页,就可以进行对商品的浏览和选择了。 1、添加登录视图 添加视图 前面我们已经实现了注册功能,用户可以成功注册,接着我们就开始让用户登录了,此节我们就实现用户的登录功能,并且登录成功后跳转商品页面查看商品。 首先,我们还是在views目录下添加登录视图页面 —— login.html,效果图如下: showImg(http:...

    Jackwoo 评论0 收藏0
  • Vue登录注册,并保持登录状态

    摘要:关于登录注册,并保持登录状态,是玩家必经之路,网上也有很多的解决方法,但是有一些太过于复杂,新手可能会看的一脸懵逼,现在给大家介绍一种我自己写项目在用而且并不难理解的一种方法。 关于vue登录注册,并保持登录状态,是vue玩家必经之路,网上也有很多的解决方法,但是有一些太过于复杂,新手可能会看的一脸懵逼,现在给大家介绍一种我自己写项目在用而且并不难理解的一种方法。 项目中有一些路由是需...

    amuqiao 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<