1.安装
npm i --save nprogress
2.在axios封装中引用
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
3.使用
开启和关闭:(分别在axios的请求拦截器和响应拦截器中使用start()和done())
NProgress.start();
NProgress.done();
还可以在路由表中引入,全局前置守卫开启,全局后置守卫关闭:
router.afterEach(() => {
NProgress.done()
})
进度环隐藏:
NProgress.configure({showSpinner: false});
调整动画设置:
NProgress.configure({ease:'ease',speed:500});
动画类型有:eas