企业网站 合同,做网站工资高吗,贵州省城乡和住房建设厅网站首页,柳州住建局官网优化Vue项目#xff0c;部署Vue项目 项目优化
添加进度条
nprogress 进度条官方文档传送门
打开 vue-ui 面板#xff0c;选择依赖#xff0c;输入 nprogress 进行安装相关依赖。 npm
Javascript npm install --save nprogress在 main.js 入口文件中#xff0c;进行相关… 优化Vue项目部署Vue项目 项目优化
添加进度条
nprogress 进度条官方文档传送门
打开 vue-ui 面板选择依赖输入 nprogress 进行安装相关依赖。 npm
Javascript npm install --save nprogress在 main.js 入口文件中进行相关配置。首先先导入包对应的js 和 css
Javascript // 导入NProgress包对应的js和css
import NProgress from nprogress
import nprogress/nprogress.css配置 request 请求拦截器 和 response 响应拦截器这样我们就能在每次网络请求时能够展示进度条了。
Javascript // 在 request 拦截器中显示进度条 NProgress.start()
// 设置axios请求拦截器
axios.interceptors.request.use(config {NProgress.start()config.headers.Authorization window.sessionStorage.getItem(token)// console.log(config)return config
})
// 在 response 拦截器中隐藏进度条 NProgress.done()
axios.interceptors.response.use(config {NProgress.done()return config
})
