axios 的二次封装及使用

 1 // 将axios再次封装
 2 import axios from 'axios';  // npm i -S axios
 3 
 4 import Qs from 'qs'  // npm i -S qs
 5 
 6 // 提示组件   mint-ui 中的提示组件
 7 
 8 axios.defaults.withCredentials = true;  // false 不跨域  true 跨域
 9 axios.defaults.headers.common["token"] = localStorage.getItem('token');  // 这是设置请求头  不是必须的
10 
11 export default function(path, params, method = "GET", headerType = "json") {
12     let baseURL = "/api";
13     let data = {};   // 将参数解析出来进行放置的地方
14     // 设置请求头
15     if(method == "post") {
16         if(headerType == "json") {
17             axios.defaults.headers.post["Content-Type"] = 
18                 "application/json;charset=utf-8";
19             data = params;   
20         } else if(headerType == "multipart") {
21             axios.defaults.headers.post["Content-Type"] = 
22                 "multipart/form-data";
23         } else {
24             axios.defaults.headers.post["Content-Type"] = 
25                 "application/x-www-form-urlencoded";
26             data = Qs.stringify(params);
27         }
28     }
29     if(method == "get") {
30         if(headerType == !"json") {
31             axios.defaults.headers["Content-Type"] = 
32                 "application/x-www-form-urlencoded;charset=utf-8";
33         }
34         data = Qs.stringify(params);
35         path = path + "?" + data;
36         data = {};
37     }
38     return new Promise( (resolve, reject) => {
39         axios({
40             baseURL,
41             method,
42             url: path,
43             data,
44             timeout: 6000
45         })
46         .then( res => {
47             resolve(res.data.result);
48         })
49         .catch( err => {
50             reject(err);
51         })
52     })
53 }   

posted @ 2021-04-21 10:12  安琪吖  阅读(2116)  评论(0编辑  收藏  举报