Vue中使用NProgress实现页面加载效果

第一步：导入包 npm install nprogress
第二步 ：引入文件

import NProgress from 'nprogress'
import 'nprogress/nprogress.css'

第三步 ： 实现加载效果

NProgress.start(); //开始加载
NProgress.done();  //加载结束

案例 ：

import NProgress from 'nprogress' 
import 'nprogress/nprogress.css' 
axios.defaults.baseURL = `http://nodeshop.lzcstudy.top/api/private/v1/` 
axios.interceptors.request.use(config => {
 // console.log(config)
 NProgress.start();
 config.headers.Authorization = window.sessionStorage.getItem('token')
 return config;
})
axios.interceptors.response.use(config => {
 // console.log(config)
 NProgress.done();
 return config;
})

详细内容 ： https://www.npmjs.com/package/nprogress

标签：Vue,axios,NProgress,import,config,nprogress,加载
来源： https://blog.csdn.net/weixin_44904995/article/details/117188213