Vue项目电商后台管理系统 nprogress--进度条

目录

前言：

简介：

效果图例：

1、安装

2、使用

3、修改进度条颜色：

结语：

---

1、安装

---

cnpm install --save nprogress

2、使用

---

// 第一步下载依赖cnpm install --save nprogress

// 第二步在router/index.js导入进度条和进度条样式

//第三部如果想要在所有进入页面都显示进度条，就使用全局路由钩子，

//如果是单个页面就使用， 路由独享守卫

位置：router/index.js

//导入

import NProgress from ‘nprogress’

import ‘nprogress/nprogress.css’

在进入页面之前开启进度条 、进入之后关闭

//路由守卫

// 进入之前路由元信息配置守卫 requiredPath为true, 适合守卫多个页面 vue3next() 变成return true

router.beforeEach((to, from, next) => {