Beispiel für die Implementierung der Wertübertragung zwischen WeChat-Miniprogrammseiten

Übergeben von Werten zwischen Miniprogrammseiten

Guten Abend allerseits. Ich sage guten Abend, weil ich dies nachts geschrieben habe. Ich sage dies, weil der Anfang dieses Satzes nicht so plötzlich ist. Was die Wertweitergabe zwischen den Seiten des Miniprogramms angeht, habe ich sie während meiner Verwendung sehr subjektiv in wx.navigateTo und nicht-wx.navigateTo unterteilt, da wx.navigateTo einen Ereignisparameter event hat. Ich springe von der aktuellen Seite zur nächsten Seite. Wenn ich zurückkehren muss, verwende ich wx.navigateTo. Die Funktion dieses Ereignisses besteht darin, die von der nächsten Seite zurückgegebenen Parameter zu empfangen. So was:

index.js

wx.navigateTo({
  URL: URL,
  Ereignisse: {
    // Fügen Sie einen Listener für das angegebene Ereignis hinzu, um die von der geöffneten Seite an die aktuelle Seite gesendeten Daten abzurufen. acceptDataFromOpenedPage: (Daten) => { // Diese Methode ist zufällig benannt, es gibt nicht viele Anforderungen, aber der erste Parameter der Ausgabe der geöffneten Seite sollte der Methodenname console.log('sour bean buns thrown from next door', Daten) sein.
    },
  },
  Erfolg: Funktion (res) {
    // Daten über eventChannel an die geöffnete Seite senden // res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'test' })
  }
})

gebi.js

// Auswahl bestätigen confirm() {
  const eventChannel = this.getOpenerEventChannel() // Dies sollte WeChats eigene Methode sein, verwenden Sie sie einfach, es ist OK eventChannel.emit('acceptDataFromOpenedPage', data) // Der Name der Methode, die Parameter im vorherigen Seitenereignis empfängt wx.navigateBack() // Zurück zur vorherigen Seite }

Diese beiden Vorgänge schließen die Wertübertragung der übergeordneten und untergeordneten Komponente ähnlich wie bei vue2.x ab, und die Ausgabe ist genau dieselbe.

Wie wird der Wert an die nächste Seite weitergegeben? Wenn Store und Storage nicht verwendet werden, können Sie die Methode mit Parametern nach der URL oder dem Erfolgsrückruf von wx.navigateTo oben verwenden. Obwohl ich den Erfolgsrückruf nicht verwendet habe, habe ich nach näherer Betrachtung das Gefühl, dass er der Art und Weise sehr ähnlich ist, wie der Haupt- und der untergeordnete Thread Daten empfangen, wenn ich Webworker verwende, um Werte an den untergeordneten Thread zu übergeben, und der untergeordnete Thread Werte an den Haupt-Thread übergibt. Einfach ausgedrückt, ich denke, es ist „Überwachung“ (addeventlistener) (0o-_^o)
Ich möchte hier erwähnen, dass dem URL-Pfad beim Springen ein / vorangestellt wird, das ist alles.

wx.navigateTo({
  URL: '/Seiten/Index/Index'
})

URL-Wert-Übertragung des Miniprogramms

Die URL-Wertübergabe des Miniprogramms ist dieselbe wie bei unseren normalen Routing-Parametern, auf die beide ein Fragezeichen (?) und ein Et-Zeichen (&) folgen, sie ist jedoch in die Datenwertübergabe des Basistyps und die Datenwertübergabe des Referenztyps unterteilt. Die häufigsten sind die folgenden:

wx.navigateTo({
  URL: '/pages/index/index?page=/pages/home/home&id=0077FF'
})

Ja, richtig gelesen, man kann einen Wert wie '/pages/home/home' übergeben. Andere Sonderzeichen sollten konvertiert werden, aber das habe ich nicht ausprobiert.

URL-Übertragungsobjekt des Applets

Wenn Sie ein Objekt oder Array übergeben:

Übertragung: Zuerst in Zeichenfolge konvertieren, dann kodieren.

Empfangen: Zuerst dekodieren, dann das Objekt konvertieren.

Daten = {
	Name: 'Kleine Stadt',
  Typ: ‚Rindfleisch-Fadennudeln‘
}
wx.navigateTo({
  URL: `/pages/index/index?page=/pages/home/home&params=${encodeURIComponent(JSON.stringify(data))}`
})

onLoad (Optionen) {
	const {page} = Optionen;
	const params = JSON.parse(decodeURIComponent(options.params))
}

Naja, dann breitet es einfach so aus, es ist nichts falsch daran.

Shop erwähnen

Ich verwende in diesem Projekt Mobx. Die in Mobx erhaltenen Array-Daten werden sehr seltsam. Die Lösung ist unbekannt. Es gibt eine toJS()-Methode in mobx, verwenden Sie sie einfach.

importiere { toJS } von „mobx-miniprogram“;
let-Wert = toJS(xxxx)

Drehsprung

Was die Sprünge betrifft, werden sie auf der offiziellen Website des Miniprogramms sehr deutlich erklärt, deshalb werde ich hier eine Tabelle erstellen.

wx.switchTab. -0-0----> Zur TabBar-Seite springen und alle anderen Nicht-TabBar-Seiten schließen (Originaltext von der offiziellen Website)

In Bezug auf EventChannel handelt es sich um den oben erwähnten Wert, der zwischen den Seiten weitergegeben wird. Ich habe nur „emitt“ verwendet. Den Rest von „off“, „on“ und „one“ habe ich nicht verwendet, daher ist es schwierig zu erklären, da es ohne das Szenario schwer zu verstehen ist. Ich denke, ich kann etwas schreiben, indem ich das Publish-Subscribe-Modell verwende.

Findest du, dass die beiden Tabellen sehr klar getrennt sind? Hehehe. Tatsächlich habe ich die Markdown-Tabelle nicht gut genutzt und es erscheint mir angemessener, sie zu trennen.

Zusammenfassen

Dies ist das Ende dieses Artikels zum Übertragen von Werten zwischen WeChat Mini-Programmseiten. Weitere relevante Inhalte zum Übertragen von Werten zwischen WeChat Mini-Programmseiten finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!