Detaillierte Erläuterung der Seitenwertübertragung im WeChat-Miniprogramm

Kürzlich sind wir bei der Entwicklung kleiner Programme in der Gruppe auf ein Thema gestoßen, das sich im Frontend nie geändert hat: Seite Wertübergabe
Ich habe gerade angefangen, die Pfadparameterübergabe zu verwenden, um das Problem zu lösen. Aber wie wir alle wissen:

Die maximale Länge der HTTP-Get-Anfrage-URL ist in jedem Browser unterschiedlich. Die maximale Länge mehrerer häufig verwendeter Browser und die Übermittlungssituation nach Überschreiten der maximalen Länge sind wie folgt :
IE6.0: Die maximale Länge der URL beträgt 2083 Zeichen und sie kann nicht übermittelt werden, nachdem die maximale Länge überschritten wurde.
IE7.0: Die maximale Länge der URL beträgt 2083 Zeichen. Sie kann auch nach Überschreiten der maximalen Länge übermittelt werden, es können jedoch nur 2083 Zeichen übergeben werden.
Firefox 3.0.3: Die maximale URL-Länge beträgt 7764 Zeichen. Sie kann nicht übermittelt werden, nachdem die maximale Länge überschritten wurde.
Opera 9.52: Die maximale Länge der URL beträgt 7648 Zeichen. Sie kann nicht übermittelt werden, nachdem die maximale Länge überschritten wurde.
Google Chrome 2.0.168: Die maximale Länge der URL beträgt 7713 Zeichen. Sie kann nicht übermittelt werden, nachdem die maximale Länge überschritten wurde.

Es fühlt sich also unzuverlässig an.
Nachdem ich die offizielle Website recherchiert habe, habe ich herausgefunden, dass es zwei Möglichkeiten gibt, dies „eleganter“ zu machen, was natürlich nicht mit Vuex/Flux zu vergleichen ist.

1. Globale Variablen verwenden
   und im Projekt definieren app.jsglobalData

   App({
    globalData:{
    userInfo:'angeladaddy'
   }
   });

   Nach dem Login kopieren

   Bei Bedarf verwenden:

   getGlobalVar:function(){
    var that=this;
   that.setData({
     globalvar_str:JSON.stringify(getApp().globalData)
   }) 
   }

   Nach dem Login kopieren

   Selbstverständlich können Sie auch jederzeit Werte zuweisen:

   onLoad:function(options){
    getApp().globalData.userInfo+=' is an awesome man';
   },

   Nach dem Login kopieren

   Wirkung:

Paste_Image.png

2. Verwenden Sie Vorlagen
Gemäß der offiziellen Einführung:

Definieren Sie zuerst die Vorlage und verwenden Sie das Namensattribut

<template name="msgItem">
  <view>
    <text> {{index}}: {{msg}} </text>
    <text> Time: {{time}} </text>
  </view>
</template>

Nach dem Login kopieren

Verwenden Sie dann die Vorlage

• Verwenden Sie das Attribut is, um die Vorlage zu deklarieren, die Sie verwenden müssen, und übergeben Sie dann die für die Vorlage erforderlichen Daten, z. B.:

  <template is="msgItem" data="{{...item}}"/>

  Nach dem Login kopieren

  Weisen Sie dem Element einen Wert zu, um die Vorlagendaten anzuzeigen

  Page({
  data: {
   item: {
     index: 0,
     msg: 'this is a template',
     time: '2016-09-15'
   }
  }
  })

  Nach dem Login kopieren

Dies löst das Problem der Seitenwertübertragung auf „duang~~~“-Weise

Postscript: Da kleine Programme alle Funktionen von ES6 nutzen können, was zum Teufel ist dann diese Variable that=this? Warum können wir keine Pfeilfunktionen verwenden, um Umfangsprobleme zu lösen? Kommen Sie zurück und versuchen Sie es erneut.

[Verwandte Empfehlungen]

1. WeChat-Miniprogramm-Spieldemo Wählen Sie verschiedene Farbblöcke

3. WeChat-Wecker: Dialogrealisierung

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Seitenwertübertragung im WeChat-Miniprogramm. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!