修改ajax的网络等待UI

src/router/axios.js

@@ -8,21 +8,21 @@ import axios from 'axios'
 import store from '../store'
 import router from '../router/router';
 import { getToken, setToken, removeToken } from '@/util/auth';
-import { Loading, Message } from 'element-ui'
+import { Message } from 'element-ui'
 import errorCode from '@/const/errorCode'
+import NProgress from 'nprogress' // progress bar
+import 'nprogress/nprogress.css'// progress bar style
 //超时时间
 axios.defaults.timeout = 30000;
 //跨域请求，允许保存cookie
 axios.defaults.withCredentials = true;
+NProgress.configure({ showSpinner: false })// NProgress Configuration
 
-let loadinginstace;
 let msg;
 
 //HTTPrequest拦截
 axios.interceptors.request.use(config => {
-	loadinginstace = Loading.service({
-		fullscreen: true
-	});
+	NProgress.start() // start progress bar
 	if (store.getters.access_token) {
 		config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行修改
 	}
@@ -32,10 +32,10 @@ axios.interceptors.request.use(config => {
 })
 //HTTPresponse拦截
 axios.interceptors.response.use(data => {
-	loadinginstace.close();
+	NProgress.done();
 	return data
 }, error => {
-	loadinginstace.close();
+	NProgress.done();
 	let errMsg = error.toString();
 	let code = errMsg.substr(errMsg.indexOf('code') + 5);
 	Message({