主要配合路由生命周期使用

  实现一个进度条的效果

  使用方法:

    1. 下载:npm install --save nprogress

    使用:NProgress.start();  开始

       NProgress.done(); 停止

  在 router 中使用路由守卫

  token 重定向的使用

  router.beforeEach(to, from, next){

    const isLogin = localStorage.eleToken ? true : false;

    if (to.path == '/login' || to.path == '/register'){

      next();

    }

    else {

      isLogin ? next() : next('/login');

    }

  }

NProgress的使用 及 路由 token 定向的使用的更多相关文章

  1. vue-element-admin 实现动态路由(从后台查询出菜单列表绑定)

    1. 在路由实例中保留基础路由 router/index.js中只需要保留基础路由,其他的都删了 2. 获取用户菜单,并保存到Vuex中 stroe/modules/user.js中,有个getInf ...

  2. vue-element-admin登录逻辑,以及动态添加路由,显示侧边栏

    这段时间在研究element-admin,感觉这个库有许多值得学习的地方,我学习这个库的方法是,先看它的路由,顺着路由,摸清它的逻辑,有点像顺藤摸瓜. 这个库分的模块非常清晰,适合多人合作开发项目,但 ...

  3. vue路由守卫配合权限,白名单

    router.beforeEach(async(to, from, next) => { // 进度条开始 NProgress.start() // 确认用户是否已登录(获取它的token值,这 ...

  4. Vue3 Vite3 状态管理 pinia 基本使用、持久化、在路由守卫中的使用

    在<基于 vite 创建 vue3 项目>一文中整合了 pinia,有不少伙伴不知道 pinia 是什么,本文简单介绍 pinia.主要包括三方面: pinia 的基本用法,在<基于 ...

  5. Asp.Net MVC中捕捉错误路由并设置默认Not Found页面。

    在Global中写一个Application_Error捕捉错误路由并重定向到Not Found页面.这里是全局性抓取错误路由,此处还可以写由错误路由导致访问失败的日志记录. protected vo ...

  6. react之路由

    功能:让用户从一个视图(组件)导航到另一个视图(组件) 前端路由是一套映射规则,在React中,是URL路径与组件的对应关系 使用React路由简单来说,就是配置路径和组件 路由的使用 1.安装路由 ...

  7. API总结

    1. 什么是Webservice WebService就是一个应用程序向外界暴露出一个能通过Web进行调用的API,也就是说能用编程的方法通过 Web 来调用这个应用程序.我们把调用这个WebServ ...

  8. vue 后台管理系统菜单权限管理

    来自:https://www.cnblogs.com/fqh123/p/11094296.html 侵删 login登录方法 login() { if (!this.username) { retur ...

  9. [Abp vNext微服务实践] - vue-element-admin登录二

    简介: Vue Element Admin是基于vue.element ui开发的后台管理ui,abp vNext是abp新一代微服务框架.本篇将会介绍如何改造Vue Element Admin权限验 ...

随机推荐

  1. C语言——指针总结

    在创建指针时,我们首先要做的是先初始化它,没有初始化的指针是很危险的,因为指针可以指向一个地址后直接改变它的值,所以为了避免我们的指针在创建后指向一个危险区域(即可能指向系统文件等),我们会先给它一个 ...

  2. About Spring MVC

    一.简介 1.Springmvc是什么 Spring Web MVC是一种基于Java的实现了Web MVC设计模式的请求驱动类型的轻量级Web框架,即使用了MVC架构模式的思想,将web层进行职责解 ...

  3. 使用2种python脚本工具将2个txt文档中的文字进行比较,并计算出Corr, WER正确率,准确率

    一.准备: linux服务器,src2mlf.py   rec2mlf.py   HResults文件,1份源文件和1份需要对比的文件.文件放置于本人云盘 二.使用方法: 1. 对比工具 HResul ...

  4. Oracle面试题及答案整理

    一下题目根据此表变换 1.表:table1(FId,Fclass,Fscore),用最高效最简单的SQL列出各班成绩最高的列表,显示班级,成绩两个字段. select stu_class, max(s ...

  5. Mysql系列-性能优化神器EXPLAIN使用介绍及分析

    MySQL 提供了一个 EXPLAIN 命令, 它可以对 SELECT 语句进行分析, 并输出 SELECT 执行的详细信息, 以供开发人员针对性优化. EXPLAIN 命令用法十分简单, 在 SEL ...

  6. (二十四)Ubuntu16.04配置ADB调试环境

    一.安装adb 1.可以通过 apt-get install android-tools-adb 来安装adb sudo add-apt-repository ppa:nilarimogard/web ...

  7. 通过JDBC驱动加载深刻理解线程上下文类加载器机制

    关于线程上下文类加载器已经在之前学得比较透了,作为一个收尾,这里用平常J2EE开发时JDBC连接Mysql数据库常见的一段代码通过分析它的底层进一步加深对线程上下文类加载器的理解,所以先来将连接应用代 ...

  8. CentOS 6 多实例 编译安装mariadb-5.5.59

    系统平台: CentOS release 6.9 (Final) 内核 2.6.32-696.el6.x86_64 1.去官网下载适合的源码包 http://mariadb.org/ mariadb- ...

  9. hdu4786 Fibonacci Tree[最小生成树]【结论题】

    一道结论题:如果最小生成树和最大生成树之间存在fib数,成立.不存在或者不连通则不成立.由于是01图,所以这个区间内的任何生成树都存在. 证明:数学归纳?如果一棵树没有办法再用非树边0边替代1边了,那 ...

  10. 长春理工大学第十四届程序设计竞赛D Capture The Flag——哈希&&打表

    题目 链接 题意:给定一个字符串 $s$,求不同于 $s$ 的字符串 $t$,使得 $Hash(s) = Hash(t)$,其中 $\displaystyle Hash(s) = \sum_0^{le ...