Encapsulating axios+promise Universal Request Function Operation

I won't talk too much, let's just look at the code ~

import axios from "axios";
import baseUrl from "../../setBaseUrl";
axios.defaults.baseURL = baseUrl;
import { Loading, Message } from "element-ui";
const loadingOptions = {
 lock: true,
 text: " Desperately loading ",
 spinner: "el-icon-loading",
 background: "rgba(0, 0, 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,
    type: "error",
    duration: 2500,
    showClose: true
   });
  });
 },
 post: 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
    .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===>", err);
     Message({
      message: err.message,
      type: "error",
      duration: 2500,
      showClose: true
     });
    });
  }).catch(function(err) {
   Message({
    message: err,
    type: "error",
    duration: 2500,
    showClose: true
   });
  });
 },
 put: 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
    .put(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===>", err);
     Message({
      message: err.message,
      type: "error",
      duration: 2500,
      showClose: true
     });
    });
  }).catch(function(err) {
   Message({
    message: err,
    type: "error",
    duration: 2500,
    showClose: true
   });
  });
 },
 delete: 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
    .delete(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===>", err);
     Message({
      message: err.message,
      type: "error",
      duration: 2500,
      showClose: true
     });
    });
  }).catch(function(err) {
   Message({
    message: err,
    type: "error",
    duration: 2500,
    showClose: true
   });
  });
 }
};
export default Http;

Additional knowledge: vuex refresh page is store updated, how to solve data backup?

I use the method is very simple, in App. vue life cycle function created, monitor the page refresh, in the page refresh time, store data in time stored in sessionStorage, and then refresh the data in sessionStorage can be taken out again

created () { // Page refresh store Data backup 
  if (localStorage.cmstoken) {
   this.$router.replace("/data");
  }else {
   this.$router.replace("/");
  }
  if (sessionStorage.getItem("store") ) { // Read when the page loads sessionStorage Status information in 
    this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(sessionStorage.getItem("store"))))
  }
  window.addEventListener("beforeunload",()=>{ // When the page is refreshed, the vuex Save the information in to sessionStorage Li 
    sessionStorage.setItem("store",JSON.stringify(this.$store.state))
  })
 },