1. Erstellen Sie eine Seite mit app.jsonGemäß unseren üblichen Entwicklungsgewohnheiten erstellen wir beim Erstellen einer neuen Seite normalerweise zuerst einen Ordner und dann die entsprechende Seite. Nach Abschluss der Erstellung wird die Seite automatisch in app.json registriert. Tatsächlich können wir die entsprechende Seite auch generieren, indem wir die Seite direkt in app.json registrieren. "Seiten": [ "Seiten/Index/Index", "Seiten/neueSeite/neueSeite" ], Tragen Sie wie oben gezeigt den Pfad in die Konfigurationsdatei ein und das Applet erstellt automatisch den entsprechenden Pfad. 2. Nutzen Sie den Kompilierungsmodus gutWenn wir eine Seite debuggen möchten, sind viele Entwickler daran gewöhnt, app.json direkt zu ändern, um die erste Stapelseite anzupassen. Tatsächlich können wir den Kompilierungsmodus verwenden, um eine Kompilierungsseite hinzuzufügen, anstatt die Konfigurationsdatei zu ändern. 3. Miniprogrammstil zur Wiederverwendung von KomponentenDies wird oft vergessen, da das Applet dieses Konfigurationselement beim Erstellen einer neuen Komponente nicht anzeigt. Konfigurieren Sie die Optionen wie folgt. Die Komponente kann den globalen Stil (app.wxss) verwenden. Komponente({ //Colorui-Stiloptionen übernehmen: { addGlobalClass: true, mehrereSlots: true }, ... } 4. app.js Initialisierung InhaltsfunktionalisierungBei vielen Miniprogrammen wird viel Inhalt in „onLaunch“ geschrieben, was sehr verwirrend ist und das spätere Debuggen besonders mühsam macht. Verschiedene Initialisierungsinhalte können als unterschiedliche Funktionen geschrieben werden, die funktionalisiert und modularisiert werden. beim Starten: Funktion (Optionen) { //Hier müssen wir den Weg zum Applet this.InitCloud(); verarbeiten. //Cloud-Dienst initialisieren/ ESC this.InitCustom(); //Initialisiere die für die benutzerdefinierte Konfiguration erforderlichen Informationen this.InitEdu(); //Initialisiere die Konfiguration des Bildungssystems}, 5. Nutzen Sie Vorlagen sinnvollBei WXML-Inhalten mit vielen Wiederholungen können Sie diese in eine Vorlagendatei extrahieren und bei der Verwendung direkt importieren. <import src="template/NexuTemplate.wxml"/> <Ansicht wx:für="{{dirlist}}" wx:key="item"> <template ist="dirshow" data="{{item}}"></template> </Ansicht> 6. Cloud-Entwicklung und Hybrid-EntwicklungInhaltssicherheitsidentifizierung, OpenID-Erfassung, Bildpornografieerkennung, Zahlungsprozess, Content-Push usw. sind nicht so einfach, wenn Sie Ihr eigenes Backend zur Implementierung verwenden. Wenn Sie jedoch Cloud-Entwicklungstechnologie verwenden, um diesen Teil zu ersetzen und sich auf die Geschäftslogik zu konzentrieren, eröffnet sich Ihnen eine neue Welt. Einige Funktionen der Cloud-Entwicklung (ich werde später einen speziellen Artikel schreiben, um den Inhalt der Cloud-Entwicklung und der Hybrid-Entwicklung vorzustellen): const cloud = erfordern('wx-server-sdk') cloud.init({ Umgebung: cloud.DYNAMIC_CURRENT_ENV }) // Cloud-Funktionseintrag Funktion exports.main = async (Ereignis, Kontext) => { // console.log(Ereignis) Schalter (Ereignis.Aktion) { Fall 'getWXACode': { returniere getWXACode(Ereignis) } Fall 'getOpenData': { returniere getOpenData(Ereignis) } Fall 'msgSecCheck': { return msgSecCheck(Ereignis) } Fall 'imgSecCheck': { returniere imgSecCheck(Ereignis) } Fall 'submitPages': { returniere submitPages(Ereignis) } Standard: { zurückkehren } } } //Holen Sie sich den Applet-Code async function getWXACode(event) { konsole.log(ereignis.url) // Hier erhalten wir den permanenten und gültigen Applet-Code, speichern ihn im Cloud-Dateispeicher und geben schließlich die Cloud-Datei-ID zurück, damit das Front-End const wxacodeResult = await cloud.openapi.wxacode.get({ verwenden kann. Pfad: event.url || 'Seiten/Index/Index', }) const fileExtensionMatches = wxacodeResult.contentType.match(/\/([^\/]+)/) const fileExtension = (fileExtensionMatches && fileExtensionMatches[1]) || 'jpg' const uploadResult = warte auf cloud.uploadFile({ // Cloud-Dateipfad. Zu Demonstrationszwecken wird hier ein fester Name verwendet: cloudPath: `wxCode/wxCode${Math.random() * 9999999}.${fileExtension}`, // Der hochzuladende Dateiinhalt kann direkt in den Bildpuffer übergeben werden Dateiinhalt: wxacodeResult.buffer, }) wenn (!uploadResult.fileID) { throw new Error(`Upload fehlgeschlagen, Datei ist leer, Statuscode des Speicherservers ist leer ${uploadResult.statusCode}`) } returniere uploadResult.fileID } // OpenID abrufen asynchrone Funktion getOpenData(Ereignis) { // Erfordert wx-server-sdk >= 0.5.0 const wxContext = cloud.getWXContext() zurückkehren { Ereignis, OpenID: wxContext.OPENID, Anwendungs-ID: wxContext.APPID, UnionID: wxContext.UNIONID, } } // Überprüfen Sie, ob der Text konform ist async function msgSecCheck(event) { // Erfordert wx-server-sdk >= 0.5.0 return cloud.openapi.security.msgSecCheck({ Inhalt: Ereignis.Inhalt, }) } // Überprüfen Sie, ob das Bild kompatibel ist async function imgSecCheck(event) { Rückkehr cloud.openapi.security.imgSecCheck({ Medien: Inhaltstyp: Ereignis.Inhaltstyp, Wert: Puffer.von(Ereignis.Wert) } }) } //Seiten einbinden async function submitPages(event) { return cloud.openapi.search.submitPages({ Seiten: [{ Pfad: Ereignispfad, Abfrage: event.query }] }) } //Datum abrufen Funktion getDateTime(sj) { var jetzt = neues Datum(sj * 1000); var jahr = jetzt.getFullYear(); var Monat = jetzt.getMonth() + 1; var date = jetzt.getDate(); var Stunde = jetzt.getHours(); var minute = jetzt.getMinutes(); // var Sekunde = jetzt.getSeconds(); gibt Jahr + „Jahr“ + Monat + „Monat“ + Datum + „Tag“ zurück; } 7. Zentralisieren Sie persönliche Konfigurationsdaten in einer DateiBeispielsweise werden Daten wie Serverdomänennamen und Schnittstellentoken, die sich ändern können, aber häufig verwendet werden, in einer Datei konzentriert. module.exports={ UseCloud:true, CloudId:'', //ID der Cloud-Entwicklungsumgebung TraceUser:true, //Benutzerzugriffsprotokoll aufzeichnen AdaptStorge:true, //Caching von Benutzerdaten zulassen SevDomain:'http://localhost' //Domänenname des Servers} 8. Nutzen Sie die Versionsverwaltungstools von EntwicklertoolsZusammenfassenDamit ist dieser Artikel mit einigen Tipps zur Beschleunigung der Entwicklung von WeChat-Miniprogrammen abgeschlossen. Weitere relevante Vorschläge zur Entwicklung von WeChat-Miniprogrammen finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird! Das könnte Sie auch interessieren:
|
<<: MySQL Installations-Tutorial unter Windows mit Bildern und Text
>>: So zeigen Sie im Hintergrund laufende Programme in Linux an und schließen sie
Das Erscheinungsbild einer Webseite hängt maßgebl...
Inhaltsverzeichnis Was ist Front-End-Routing? Wie...
1. Um die Abfrage zu optimieren, sollten Sie voll...
Dieser Statuscode gibt Auskunft über den Status d...
1.Befehl nicht gefunden Befehl nicht gefunden 2. ...
Herstellen einer Verbindung mit MySQL Hier verwen...
Verwenden des UNION-Operators Union : Wird verwen...
Inhaltsverzeichnis einführen Hauptmerkmale Effekt...
Vorwort Das Docker-Image kann nicht gelöscht werd...
Lassen Sie uns nun mehrere Situationen zur Steuer...
Dieser Artikel beschreibt die Mysql-Self-Join-Abf...
0x0 Einführung Zunächst einmal: Was ist ein Hash-...
In diesem Artikel wird das Gesundheitsmeldesystem...
Um eine inkrementelle Sicherung der MySQL-Datenba...
Verwenden Sie nginx, um die Trennung von PC-Site ...