怎么在年报网站做简易注销,网站建设交接协议书,上海工商网查询营业执照,推广方案的内容有哪些请求后端防止重复点击#xff0c;用户点击加入遮罩层#xff0c;请求完毕关闭遮罩层
我们利用请求拦截器#xff0c;在用户点击的时候#xff0c;弹出遮罩层 本文采用i18n国际化 element plus UI#xff0c;提取你想要的#xff0c;这里不做简化
完整代码如下#xf…请求后端防止重复点击用户点击加入遮罩层请求完毕关闭遮罩层
我们利用请求拦截器在用户点击的时候弹出遮罩层 本文采用i18n国际化 element plus UI提取你想要的这里不做简化
完整代码如下
// src/service/httpService.jsimport axios from axios;
import { ElMessage, ElLoading } from element-plus;
import i18n from ../i18n;const apiEndpoint process.env.VUE_APP_API_ENDPOINT;const httpClient axios.create({baseURL: apiEndpoint /api,
});let loadingInstance;// 请求拦截器
httpClient.interceptors.request.use(config {loadingInstance ElLoading.service({ fullscreen: true, text: Loading... });const token localStorage.getItem(token) || sessionStorage.getItem(token);if (token) {config.headers[Authorization] Bearer ${token};}return config;
}, error {if (loadingInstance) loadingInstance.close();return Promise.reject(error);
});httpClient.interceptors.response.use(response {if (loadingInstance) loadingInstance.close();return response;}, error {if (loadingInstance) loadingInstance.close();let message ;let messageType error; // 默认消息类型if (error.response) {const status error.response.status;message error.response.data.message || i18n.global.t(defaultErrorMessage);if (status 200) {messageType info;} else if (status 300 status 400) {messageType warning;} else if (status 400 status 500) {messageType warning;} else if (status 500) {messageType error;}} else if (error.request) {message i18n.global.t(noResponse);messageType error;} else {message i18n.global.t(requestError);messageType error;}ElMessage({showClose: true, message: message, type: messageType, duration: 5000,});return Promise.reject(error);}
);export const get async (url, params {}) {const response await httpClient.get(url, { params });return response.data;
};export const post async (url, data) {const response await httpClient.post(url, data);return response.data;
};export default {get,post,
};
