Vue项目页面跳转时,窗口上方显示进度条(Vue使用NProgress)
NProgress是页面跳转是出现在浏览器顶部的进度条
官网:http://ricostacruz.com/nprogress/
github:https://github.com/rstacruz/nprogress
1.安装
npm install nprogress
2.安装
在router配置文件下导入
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
router.beforeEach((to, from, next) => {
NProgress.start()
next()
})
router.afterEach((to, from) => {
NProgress.done()
})
3.基本用法
只需调用并控制进度条。start() done()
NProgress.start();
NProgress.done();