vue2封装axios接口代码
2023-04-04 19:41:32 来源: 腾讯云
(资料图)
@toc
在/utils新建request
import axios from "axios"import bus from "@/utils/bus"import {Message} from "element-ui"const service = axios.create({ baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url // baseURL: "/api", // url = base url + request url timeout: 100000, // request timeout})service.interceptors.request.use( config => { let currentUser = JSON.parse(sessionStorage.getItem("UserInfo")) if (currentUser && currentUser.token) { config.headers["Authorization"] = "token " + currentUser.token } return config }, error => { console.log(error) return Promise.reject(error) })// response interceptorservice.interceptors.response.use( response => { return response }, error => { const res = error.response.data const status = error.response.status if (status >= 500) { Message.error("服务繁忙请稍后再试") } else if (status >= 400) { if (res.status === 401) { Message.warning("您的账号登录已失效, 请重新登录") bus.$emit("logout") } else { Message.error("未知错误") console.error(error) } } return Promise.resolve(error) })export default service
接口js页面中
// 卡片管理模块import request from "@/utils/request"// getexport function getList(params) { return request({ url: "/", method: "get", params })}// POSTexport function postList(data) { return request({ url: "/", method: "POST", responseType: "arraybuffer", data })}
vue页面
//引入import { getList, postList} from "@/api/comparison.js";//使用 getList().then((res) => { });
标签:
[责任编辑:]
猜你喜欢
- (2023-04-04)vue2封装axios接口代码
- (2023-04-04)@所有游客:查收这份清明出游提示 四月这些著名景区免费玩!
- (2023-04-04)京杭大运河再次实现全线水流贯通 精选
- (2023-04-04)普通高等教育十一五国家级规划教材·服装跟单实务_对于普通高等教育十一五国家级规划教材·服装跟单实务简单介绍 每日关注
- (2023-04-04)要闻速递:国产数据库性能打破世界纪录 国产化技术迎来新突破
- (2023-04-04)百万医疗险报销白血病吗?白血病农村合作医疗能报销多少?
- (2023-04-04)醉驾司机深夜闯关卡后躲进店铺,店老板吓得大喊“出去”,结果——|当前视点