Praktische Fähigkeiten zur Entwicklung von WeChat-Applets: Datenübertragung und -speicherung

Indem ich die verschiedenen Probleme, auf die ich bei meiner täglichen Entwicklung gestoßen bin, kombiniert und die Lösungen für verschiedene Probleme durchsucht habe, habe ich einige Fähigkeiten und Wissenspunkte zusammengefasst, die ich bei der täglichen Entwicklung häufig verwende. Ich hoffe, Sie geben mir einige Ratschläge.

1. Kurzlebige Datenspeicherung

Es wird empfohlen, die Daten vom Start des Applets bis zum vollständigen Herunterfahren im Ordner app.js zu speichern und auf app.js zu verweisen:

const app =getApp();

Angenommen, der Wert ist ein Datenelement, das im Lebenszyklus des Miniprogramms häufig verwendet wird, z. B. ein Token zum Anfordern einer API, ein dynamisches Token usw. Anschließend können Sie diesen Wert der globalen Variable zuweisen. Tatsächlich ist globalData in app.js nicht die einzige globale Variable, Sie können Ihren eigenen Datensatz definieren.

App({
  eduOS:
    Zeichen:''
  },
  ...
})

Es ist sehr einfach, dem Token in app.js einen Wert zuzuweisen. Solange die Seite auf app.js verweist

app.eduOS.token = Wert;

Diese Daten sind vom Start des Miniprogramms bis zur vollständigen Schließung des Hintergrunds für lange Zeit vorhanden und können bei Bedarf geändert werden. Der Wert kann ein Objekt sein.

2. Langer Lebenszyklus oder vertrauliche Datenspeicherung

Das Besondere an diesem Datentyp ist, dass er nach dem Schließen und Neustarten des Miniprogramms weiterhin vorhanden ist oder die privaten Informationen des Benutzers enthält, aber erneut verwendet werden muss. In diesem Fall kann der lokale Cache verwendet werden, um dieses Problem zu lösen.

Lebenszyklus des lokalen Caches: Die Verwendung des Miniprogramms wird gestartet-----> Das Miniprogramm wird vollständig aus der Verwendungsliste entfernt.

So legen Sie den Cache im Applet fest:

wx.setStorage({
            Schlüssel: 'educookie',
            Daten: {
              xh: das.Daten.xh,
              pwd: das.Daten.pwd
            }
          })

So erhält das Miniprogramm den Cache:

 var das = dies;
 wx.getStorage({
      Schlüssel: 'educookie',
      Erfolg: Funktion (Res) {
        dass.setData({xh:res.data.xh,pwd:res.data.pwd});
      },
    })

Wenn Sie beispielsweise die Anmeldeinformationen des Benutzers, nicht jedoch die privaten Daten des Benutzers speichern möchten, können Sie diese Methode verwenden.

Oder es handelt sich um nicht zeitkritische Daten, die auf diese Weise gespeichert werden können.

3. Dynamische Informations- oder Konfigurationsinformationsspeicherung

Speichern Sie die Konfigurationsinformationen des Benutzers und führen Sie beim Wechseln des Mobiltelefons schnell eine Konfigurationssynchronisierung durch.

Wenn das Miniprogramm eines Händlers empfohlene Produkte ändern, Inhalte überarbeiten oder Aktivitäten hinzufügen muss, ist es unmöglich, es jedes Mal neu zu schreiben und es dann erneut vom Miniprogramm überprüfen zu lassen.

Zu diesem Zweck können diese Informationen im Backend-Server gespeichert werden.

Nehmen wir als Beispiel ein Karussell-Werbeplakat eines Miniprogramms:

{
 Anzeige1:'imgurl1',
 Anzeige2:'imgurl2',
 Anzeige3:'imgurl3'
}

Speichern Sie diese Daten auf dem Hintergrundserver und fordern Sie die Hintergrunddaten bei jedem Aktualisieren der Seite an, um den Inhalt zu ändern.

wx.Anfrage({
 URL: „XXX“,
 Daten:{},
 Erfolg(res){
  dass.setData({
   adList:res.data
  })
 }
})

Auf ähnliche Weise kann eine dynamische Steuerung oder Cloud-Synchronisierung einiger Daten erreicht werden.

4. Datentransfer zwischen Seiten

1. URL-Parametrisierung

Der Datentransfer zwischen Seiten ist grundsätzlich unkompliziert. Der Lebenszyklus dieser Art von Daten ist einmalig und sie werden nach der Verwendung gelöscht.

wx.navigatorTo({
 URL: '../index/index?param1=Wert1&param2=Wert2'
})

//Abrufen bei Laden (Optionen) {
 console.log(Optionen.Param1);//Wert1
}

Sie können sich auf die Methode zur Übergabe der Formularparameter in der HTTP-Anforderung beziehen, um die Parameterübergabe zwischen Seiten zu schreiben.

2.Speicherform Lieferung

Wenn zu viele Daten übertragen werden müssen, können sie über Map <Schlüssel, Storge> übertragen werden. Einzelheiten finden Sie in der offiziellen Dokumentation.

wx.setStorage({
  Schlüssel: 'xxx',
  Daten: meineDaten
})
//Holen Sie sich wx.getStorgeSync('')

Zur Parameterübergabe genügt es, einen Schlüssel zu übergeben, der dann in anderen Schnittstellen wieder den lokalen Cache abruft. Für diese Art von Daten empfiehlt es sich, den Cache nach der Verwendung sofort zu löschen.

wx.removeStorage({
  Schlüssel: 'xxx',
  Erfolg(res) {
    Konsole.log(res)
  }
})

3. Verwenden Sie globale Variablen als Vermittler

const app = getApp();
Seite({
 app.globalData.isBackvalue = true; //Bestätigen Sie, dass es sich um den zurückgegebenen Wert handelt app.globalData.tmpData = value; //Der Wert, den Sie übergeben möchten, Sie können auch den Cache festlegen })

Gehen Sie auf die zurückgegebene Seite

const app = getApp();
...
beiAnzeigen(){
  wenn(app.globalData.isBackValue){
   dies.setData({
    XXX:app.globalData.tmpData
   })
   //Oder weisen Sie Werte zu, indem Sie die Cache-Methode abrufen}
}

4. Seitenstapel

Diese Methode kann allen in den Stapel geschobenen Seiten Werte zuweisen. Studenten mit Berufserfahrung können dies als Push/Pop-DFS-Durchquerung des Baums verstehen, und alle Seiten im Stapel können Daten übertragen.

var allpages = getCurrentPages(); //Alle Seitendaten abrufen //Der Stapelindex beginnt bei 0. Die ersten Seitendaten, die beim Aufrufen der Seite geladen werden, sind allpages[0], die aktuelle Seite ist allpages[allpages.length - 1] und die vorherige Seite ist allpages[allpages.length - 2]
var prepagedata = allpages[allpages.length - 2].data; //Daten der vorherigen Seite abrufen.
var prepage = allpages[allpages.length - 2]; //Vorherige Seite abrufen, einschließlich Daten und Methoden //Daten festlegen Methode prepage.setData({
 XXX:Wert //XXX ist der Parameter in den Daten der vorherigen Seite, Wert ist der einzustellende Wert})
//Funktionsmethode aufrufen, die Callfunction-Funktion muss in der Prepage definiert werden, bevor prepage.callfunction() aufgerufen wird;

5. Kommunikationskanal EventChannel

Tipps (So verstehen Sie die Kommunikationspipeline): Sie können sich die Pipeline als eine Form der Informationsübertragung per URL oder Speicher vorstellen, sie ist jedoch in Form eines Objekts gekapselt.

Eine Seitenlieferung

wx.navigateTo({
      URL: „Seite B“,
      Erfolg:res=>{
        res.eventChannel.emit('channeldata', {name:'kindear'})
      }
})

B-Seite Empfang

  onLoad: Funktion (Optionen) {
    : Lassen Sie eventChannel = this.getOpenerEventChannel();
    eventChannel.on('channeldata', data => {
      console.log(Daten)
        //Erfolgreich drucken {name:'kindear'}
    })
  }

Zusammenfassen

Dies ist das Ende dieses Artikels über praktische Fähigkeiten bei der Entwicklung von WeChat-Miniprogrammen – Datenübertragung und -speicherung. Weitere relevante Inhalte zu Datenübertragung und -speicherung von WeChat-Miniprogrammen finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den unten aufgeführten verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!