nprogress路由切换添加进度条

时间:2022-07-26
本文章向大家介绍nprogress路由切换添加进度条,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

文档地址

安装

npm install nprogress -S

在vue路由页面进行引入

import NProgress from 'nprogress'
import 'nprogress/nprogress.css'npm install nprogress -S

使用

router.beforeEach((to, from, next) => {
  NProgress.start();
  next()
})

router.afterEach(() => {
  NProgress.done()
})