我就廢話不多說了，大家還是直接看程式碼吧~

import axios from "axios";
import baseUrl from "../../setBaseUrl";
axios.defaults.baseURL = baseUrl;
import { Loading,Message } from "element-ui";
const loadingOptions = {
 lock: true,text: "拼命載入中",spinner: "el-icon-loading",background: "rgba(0,0.7)"
};
if (localStorage.token) {
 axios.defaults.headers.common["x-token"] = localStorage.token;
}
const Http = {
 get: function(url: string,data: any,isLoading: boolean) {
  if (localStorage.token) {
   axios.defaults.headers.common["x-token"] = localStorage.token;
  }
  let loading: any;
  if (isLoading) {
   loading = Loading.service(loadingOptions);
  }
  return new Promise<any>((resolve,reject) => {
   axios
    .get(url,{ params: data })
    .then(function(res) {
     if (isLoading) {
      loading.close();
     }
     if (res.data.code === 200) {
      resolve(res.data.data);
     } else {
      // console.warn("Http error Info ===> ",res.data);
      reject(res.data.message);
     }
    })
    .catch(function(err) {
     if (isLoading) {
      loading.close();
     }
     // console.warn("Http error Info ===> ",err);
     Message({
      message: err.message,type: "error",duration: 2500,showClose: true
     });
    });
  }).catch(function(err) {
   Message({
    message: err,showClose: true
   });
  });
 },post: function(url: string,reject) => {
   axios
    .post(url,data)
    .then(function(res) {
     if (isLoading) {
      loading.close();
     }
     if (res.data.code === 200) {
      resolve(res.data.data);
     } else {
      reject(res.data.message);
     }
    })
    .catch(function(err) {
     if (isLoading) {
      loading.close();
     }
     // console.warn("Http error Info===>",put: function(url: string,reject) => {
   axios
    .put(url,delete: function(url: string,reject) => {
   axios
    .delete(url,showClose: true
   });
  });
 }
};
export default Http;

補充知識：vuex重新整理頁面是store被更新，如何解決資料備份？

我用的方法很簡單，在App.vue中的生命週期函式created中，監聽頁面重新整理，在頁面重新整理的時候，將store的資料及時儲存在sessionStorage中，然後重新整理完畢後就可以將sessionStorage中的資料再取出來用

created () { //頁面重新整理store資料備份
  if (localStorage.cmstoken) {
   this.$router.replace("/data");
  }else {
   this.$router.replace("/");
  }
  if (sessionStorage.getItem("store") ) { //在頁面載入時讀取sessionStorage裡的狀態資訊
    this.$store.replaceState(Object.assign({},this.$store.state,JSON.parse(sessionStorage.getItem("store"))))
  }
  window.addEventListener("beforeunload",()=>{ //在頁面重新整理時將vuex裡的資訊儲存到sessionStorage裡
    sessionStorage.setItem("store",JSON.stringify(this.$store.state))
  })
 },

以上這篇封裝 axios+promise通用請求函式操作就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支援我們。