Im vorherigen Artikel wurde die Implementierungsmethode zur Verwendung von Promise zur Kapselung des kleinen Programms wx.request vorgestellt. Dieser Artikel konzentriert sich auf die Methode zur Verwendung von Promise zur Kapselung von wx.request. Der spezifische Inhalt ist wie folgt: Warum wx.request kapseln?Denn wenn wir eine Schnittstelle anfordern, fordern wir manchmal mehrere APIs einer Schnittstelle an. Wenn wir keine Kapselung verwenden, wird das Schreiben von Code mühsam und führt auch zu Leistungsproblemen. Die Kapselung erleichtert uns das Schreiben, verbessert das Benutzererlebnis und vereinfacht die Codeänderung. Warum sollten Promises für Kapselungsentscheidungen verwendet werden?Wenn wir ein WeChat-Applet schreiben, wenn wir wx.request schreiben, denke ich, dass jeder mit dieser Schreibmethode vertraut sein sollte, die der Schreibmethode von $.ajax ähnelt. Wir müssen mit der Kapselung von $.ajax vertraut sein, sodass es für uns nicht schwierig ist, sie mit Promise zu verknüpfen. Und unser WeChat-Applet unterstützt die es6-Syntax, daher ist Promise eine gute Wahl für die Kapselung. Wie kapselt man wx.request?Nachdem wir nun den Grund und die Werkzeuge für die Kapselung gefunden haben, besteht der nächste Schritt darin, das knifflige Ding wx.request zu kapseln. Erstellen Sie zunächst eine Datei in unserem Entwicklungstool Wir verpacken es in einen großen Ordner und bearbeiten die Inhalte separat. Zuerst verwenden wir in unserer Datei fetch.js promise, um wx.request zu kapseln: //Versprechen kapselt wx.request module.exports=(URL,Daten,Methode)=>{ //Definieren Sie zuerst das Versprechen let promise = neues Versprechen((lösen, ablehnen) => { wx.Anfrage({ URL:URL, Daten:Daten, Methode:Methode, //Ausführen erfolgreich(res){ Entschlossenheit (res) }, //Ausführen fehlgeschlagen (Fehler) { ablehnen (Fehler) }, }) }) // Pushen Sie das Versprechen, um das Versprechen zurückzugeben } Dann können wir in unsere Datei api.js alles einfügen, was wir für eine einheitliche Verwaltung hier anfordern müssen: //Schnittstelle managementmodule.exports={ "Banner":"/h8/home/multidata" } Schließlich zentralisieren und verwenden wir es in unserer http.js-Datei: //Datei einführen const api=require("./api") const fetch = erfordern("./fetch") //Definieren Sie den Pfad let baseUrl="http://123.207.32.32:8000/api" //Inhalt exportieren Funktion Banner(){ Rückgabewert: fetch(baseUrl+api.banner,{},'get') } module.exports={ Banner } Nach der Kapselung müssen wir es in die globale Datei app.js importieren, bevor wir es verwenden können: const http = erfordern('./http/http.js') App({ http, }) In der Datei verwenden: //App vorstellen const app = getApp() Seite({ Daten: { Liste:[] } beim Laden: Funktion () { app.http.banner().then(res)=>{ dies.setData({ Liste:res.data.data.banner.list }) } } Dies ist das Ende dieses Artikels über die Promise-Kapselung von wx.request. Weitere relevante Inhalte zur Promise-Kapselung von wx.request finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird! Das könnte Sie auch interessieren:
|
<<: So zeigen Sie Linux-SSH-Dienstinformationen und den Ausführungsstatus an
>>: Diagramm der Installationszusammenfassung für MySQL 8.0.11
In diesem Artikel wird die Vant Uploader-Komponen...
Inhaltsverzeichnis 1. Docker ermöglicht Fernzugri...
Diese Geschichte beginnt heute mit einer unerwarte...
Inhaltsverzeichnis Mindmap Einfaches Verständnis ...
Kurzeigenschaften werden verwendet, um mehreren E...
Inhaltsverzeichnis 1. Erstellen Sie eine SQL-Skri...
Inhaltsverzeichnis 1. Proxy im LAN 2. Intranet-Pe...
In diesem Artikel wird hauptsächlich der Stil der...
MyISAM-Speicher-Engine Die MyISAM-Speicher-Engine...
Ich entwickle derzeit eine Video- und Tool-App, ä...
Der SYN-Angriff ist die häufigste und am leichtes...
Vue+js realisiert das Ein- und Ausblenden des Vid...
In der Vergangenheit wurde Float häufig für das L...
Weiterleitung zwischen zwei verschiedenen Servern...
Inhaltsverzeichnis Einführung in Bootstrap und di...