zoukankan      html  css  js  c++  java
  • vue路由

    vue使用redired对路由重定向:

    {
        path: '*',
        redirect: {
          name: 'login'
        }
    }
    设置根目录
    {
        path: "/",
        name: 'login',
        component: login,
      }
    设置地址栏地址正常显示:添加mode: 'history',
    设置页面是否登录,登录后正常跳转,未登录跳转至指定页(登录页)
    在需要过滤的页面添加mate>auth,不需要过滤页面不用添加。
    export default new Router({
      mode: 'history',
      routes: [{
        path: "/",
        name: 'login',
        component: login,
      }, {
        path: '/HelloWorld',
        name: 'HelloWorld',
        component: HelloWorld,
        meta: {
          auth: true
        }]
    })
    在main.js中添加router.beforeach守卫
    router.beforeEach((to, from, next) => {
      if (to.matched.some(m => m.meta.auth)) {
        // 对路由进行验证    
        var  token=sessionStorage.getItem("token");
        if (token) { // 已经登陆       
          next() // 正常跳转到你设置好的页面     
        } else {
          // 未登录则跳转到登陆界面,query:{ Rurl: to.fullPath}表示把当前路由信息传递过去方便登录后跳转回来;
          next({
            name: 'login',
            query: {
              Rurl: to.fullPath
            }
          })
        }
      } else {
        next()
      }
    })
     
    可以在登录的时候存入session,在访问页面进行验证。记得设置next(),
  • 相关阅读:
    Ubuntu命令行快捷启动Matlab
    用xmanager6启动Linux上的图形界面程序
    Winscp远程连接Linux主机,上传和下载文件
    Xshell6连接Ubuntu18.04
    Windows10通过VNC远程连接Ubuntu18.04
    获取Linux ip
    关联Anaconda和最新Pycharm2018.3.2
    asp.net mvc 外网获取不到port问题解决
    js 毫秒换算成秒
    c# 监听文件夹动作
  • 原文地址:https://www.cnblogs.com/yeyuqian/p/13992542.html
Copyright © 2011-2022 走看看