先安裝 axios
npm install axiosaxios的詳細介紹以及用法 就不多說了請 移步 github ➡️
下面是簡單的封裝乙個 http.js， 在此說明 checkstatus 這個方法呢 是不一定需要的 ，根據個人的專案需求吧，也可以直接返回response，交給後面另行處理也行。
或者根據後端返回的狀態，在裡面進行處理 也行。
"use strict";
import axios from "axios";
//新增請求***
axios.interceptors.request.use(
config => ,
error =>
);//新增響應***
axios.interceptors.response.use(
response => ,
error =>
);function checkstatus(response) else );
}});
}export default ).then(response => );
},get(url, params) ).then(response => );}};
在vue 專案中，main.js這個檔案
使用 helloworld.vue
...在main.js中將http.js import 進來 並暴露到全域性使用，在任何vue 頁面中 就不再需要 import http.js了，而直接通過 this.$http.post this.$http.get 來使用，在checkstatus中統一非同步返回，順便可以處理錯誤的情況。methods: );
console.log(res);
} catch (error)
},async testget() )
.catch(error => );
}}....
個人思考：
checkstatus方法 返回了乙個 promise
鏈式結構的話看上面那個get的方法，this.$http.get(...).then(...).catch(...)，如果then 裡面又來乙個 http請求 會一層包住一層。
如果使用了語法糖 async await ，雖然 看起來好像是簡單了 不用 一層包住一層 層層巢狀，可是你必須要用到 try catch，如果出現異常 則直接到catch，不會再執行下面到方法。如果再實際業務中，就算出現了某乙個http請求失敗到情況，不影響下面的邏輯要繼續跑下去呢，這個就不適用了。鏈式結構也是 如果catch到異常 也不會執行then 裡面到方法了。
所以，是否把返回的promise，全部都返回的是 resolve，那麼 就不會說出現直接到了 catch 裡面不執行以下的業務了邏輯了呢。而且如果使用了語法糖 await **看起來更加簡潔 也不需要 try catch了， 這樣的話 reject是不是就不需要用到了呢。
function checkstatus(response) else );個人覺得這兩種方案各有優劣，實際應用中還是應該根據個人業務需求 業務情況而定。}});
}
引自
vue中axios的封裝
cnpm install axios s 第二步建立乙個htttp.js response 從哪個頁面跳轉 return response error 封裝get方法 param url param data returns export function fetch url,params then...
Vue中axios的封裝
npm install axios 命令列安裝axios 首先，新建乙個js檔案用於引入axios。比如說，新建乙個http.js檔案，在檔案中引入步驟如下所示 import qs from qs 引入qs模組，為post型資料提供序列化 非常重要 import from vant 設定請求超時 a...
vue中axios的封裝使用
npm install axios s 或者 npm i axios simport axios from axios vue.prototype.axios axios 將axios繫結到vue的原型上module.exports before import axios from axios im...