Ein vollständiges Tutorial zur Verwendung der Axios-Kapselung in Vue

	npm installiere axios -S
	Oder npm i axios -S

	Axios von „Axios“ importieren
	Vue.prototype.$axios = axios //Bindet axios an den Prototyp von Vue

	modul.exporte = {
	 öffentlicher Pfad: './',
	 //Domänenübergreifende Anfragen konfigurieren devServer: {
	  open: true, // Ob der Browser automatisch geöffnet werden soll https: false, // Ob https aktiviert werden soll
	  hotOnly: falsch,
	  Proxy: { // Domänenübergreifendes Konfigurieren von '/API': {
	    Ziel: 'http://********', //Schnittstellendomänenname anfordern ws: true,
	    sicher: falsch,
	    changOrigin: true, //Ob Kreuzungen erlaubt sein sollen pathRewrite: {
	     '^/api': ''
	    }
	   }
	  },
	  vorher: app => { }
	 }
	}

Axios von „Axios“ importieren
//Hier verweisen wir auf das Laden des Elements im Vollbildmodus. Importieren Sie { Loading } von "element-ui";

const service = axios.create({
 Basis-URL: '/',
 timeout: 30000 // Anforderungs-Timeout festlegen})
let laden = "";
//Interceptor anfordern service.interceptors.request.use(
 (Konfiguration) => {
  // Führen Sie eine Verarbeitung durch, bevor die Anfrage gesendet wird, if (!(config.headers['Content-Type'])) {
   wird geladen = wird geladen.service({
    Sperre: wahr,
    Text: „Wird geladen …“,
    Spinner: "el-icon-loading",
    Hintergrund: "rgba(255,255,255,0.7)",
    benutzerdefinierte Klasse: "Anfrage wird geladen",
   });
   wenn (Konfigurationsmethode == 'post') {
    config.headers['Inhaltstyp'] =
     „Anwendung/json;Zeichensatz=UTF-8“
    für (var key in config.data) {
     wenn (Konfigurationsdaten[Schlüssel] === '') {
      config.data[Schlüssel] löschen
     }
    }
    Konfigurationsdaten = JSON.stringify(Konfigurationsdaten)
   } anders {
    config.headers['Inhaltstyp'] =
     „Anwendung/x-www-form-urlencoded;Zeichensatz=UTF-8“
    Konfigurationsdaten = JSON.stringify(Konfigurationsdaten)
   }
  }
  Konstantentoken = "Token"
  // Jede Anfrage muss ein Token enthalten -- ['X-Token'] ist ein benutzerdefinierter Schlüssel. Bitte ändern Sie ihn entsprechend der tatsächlichen Situation. if (token) {
   config.headers['Autorisierung'] = Token
  }
  Konfiguration zurückgeben
 },
 (Fehler) => {
  wird geladen.schließen();
  // Senden von console.log (Fehler) fehlgeschlagen
  returniere Promise.reject(Fehler)
 }
)

// Antwort-Interceptor service.interceptors.response.use(
 (Antwort) => {

  wird geladen.schließen();
  // dataAxios sind die von axios zurückgegebenen Daten.
  // wird geladenInstance.close();
  const dataAxios = antwort.data
  // Dieser Statuscode ist die mit dem Backend vereinbarte Rückgabe von dataAxios
 },
 (Fehler) => {
  returniere Promise.reject(Fehler)
 }
)

	Standarddienst exportieren

 // Importieren Sie die gepackten Axios
 // ps: Wenn keine Kapselung vorhanden ist, können Sie Axios aus "./api" importieren.
	// /api ist die Pfadvariable für die domänenübergreifende Konfiguration let reportUpload= '/api/report/upload'
  export const Upload= () => {
   gibt axios.get zurück (reportUpload)
  }

//Einführung der gekapselten Schnittstelle import { Upload} from "@/api/http.js"; 

// Aufruf mit asynchronem Upload() {
  let { Ergebnis } = warte auf getlist ();
  	console.log(Ergebnis)
 },