安装
npm install axios -S
全局引入
在main.js中进行全局注册
main.js
创建axios文件夹
image.png
在index.js文件中，创建axios实例，并进行请求拦截
import axios from "axios";
// 创建axios实例
const service = axios.create({});
// request拦截器
service.interceptors.request.use(
config => {
config.headers["tokenid"] = "435065970"; // 请求头中添加tokenid
return config;
},
error => {
Promise.reject(error);
}
);
// response拦截器
service.interceptors.response.use(
response => {
if (response) {
return response.data;
} else {
Promise.reject(new Error("error"));
}
},
error => {
if (JSON.stringify(error).includes("401")) {
alert("登录已过期，请重新登录！");
} else {
alert(error);
}
return Promise.reject(error);
}
);
export default service;
在first.js进行封装获取数据
import axios from "./index";
export class firstApi {
// 获取信息
static getFisrtList() {
return axios.get(`first.json`).then(res => res.data);
}
}
获取数据
first.vue获取数据
<script>
import { firstApi } from "../src/axios/first";
export default {
created() {
firstApi.getFisrtList().then(res => {
window.console.log(res);
});
}
};
</script>
image.png
