So übertragen Sie Daten zwischen Miniprogrammseiten

hzc
Freigeben: 2020-07-01 09:55:11
nach vorne
2738 Leute haben es durchsucht

Ich habe kürzlich an einem Miniprogrammprojekt gearbeitet und festgestellt, dass einige Daten häufig zwischen den Seiten des Miniprogramms ausgetauscht werden müssen. Aufgrund meines eigenen Verständnisses und meiner Vertrautheit bin ich zu dem Schluss gekommen, dass es verschiedene Datenübertragungsmethoden für unterschiedliche Datenanforderungen gibt. Hier eine kurze Einführung und Zusammenfassung.

Der erste Typ: Übergeben Sie die URL, wenn die Seite springt.

Bei Verwendung von wx.navigateTo und wx.redirectTo können Sie einen Teil der Daten in die URL einfügen und zur neuen hinzufügen Seite onLoad Erhalten und initialisiert, wann.

//pageA.js

// Navigate
wx.navigateTo({
  url: '../pageB/pageB?name=lin&gender=male',
})

// Redirect
wx.redirectTo({
  url: '../pageB/pageB?name=lin&gender=male',
})

// pageB.js
...
Page({
  onLoad: function(option){
    console.log(option.name + 'is' + option.gender);
    this.setData({
      option: option
    });
  }
})
Nach dem Login kopieren

Zu beachtende Probleme:

  1. Bei Verwendung von wx.navigateTo und wx.redirectTo ist es nicht erlaubt, zu der im Tab enthaltenen Seite zu springen;
  2. Nur einmal ausgeführt;
  3. onLoad
  4. Anwendbar:
Diese Methode eignet sich im Allgemeinen für die Übertragung kleiner Datenmengen zwischen einigen Seiten, z. B. Seite B, die 1-2 Daten von Seite A erfordert , usw.


Zweitens: Verwenden Sie globale Variablen zum Übergeben

Definieren Sie globale Variablen

in der app.js-Datei. Die alte Seite speichert die zu übergebenden Daten darin und die neue Seite Rufen Sie die globale Variable auf.

// app.js

App({
     // 全局变量
  globalData: {
    name: null
  }
})

//pageA.js
···
getApp().globalData.name = "lin";


//pageB.js
···
this.setData({
  userName: getApp().globalData.name
});
Nach dem Login kopieren
globalData Wichtige Hinweise: Wenn Sie

verwenden, verwenden Sie direkt
    , um die gespeicherten Informationen abzurufen.
  1. getApp()
  2. Anwendbar:
Diese Methode eignet sich im Allgemeinen für mehrere Seiten oder alle Seiten müssen dieselben Daten abrufen und verwenden, z. B. Benutzerinformationen, die erhalten werden, sobald Sie die Homepage betreten


Dritte Methode: Lokalen Cache verwenden

Lokalen Cache im Miniprogramm verwenden

Die alte Seite speichert die übertragenen Daten im Cache und die neue Seite erhält die Daten durch Aufrufen der API um den Cache zu bekommen.

//pageA.js
···
wx.setStorageSync('sessionId', res.sessionId);


//pageB.js
···
var sessionId = wx.getStorageSync('sessionId');
Nach dem Login kopieren
StorageWichtige Dinge:

Der Speicher überschreibt bei jedem Speichern den ursprünglichen Inhalt, der dem Schlüssel entspricht.
  1. Wenn der Benutzer das Miniprogramm aktiv löscht oder aufgrund von Speicherplatz vom System gelöscht wird, werden die Daten im Speicher gelöscht.
  2. Die maximale Datenlänge, die in einem einzelnen Schlüssel gespeichert werden darf, beträgt 1 MB, und die Obergrenze für die gesamte Datenspeicherung beträgt 10 MB.
  3. Anwendbar:
Diese Methode eignet sich im Allgemeinen für Daten, die auch dann beibehalten werden müssen, wenn das Applet beendet und dann erneut gestartet wird, ähnlich wie die Beibehaltung des Anmeldestatus usw.


Empfohlenes Tutorial: „

WeChat Mini-Programm

Das obige ist der detaillierte Inhalt vonSo übertragen Sie Daten zwischen Miniprogrammseiten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:jianshu.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!