Teilen Sie eine kleine Erkundung des Werttransfers auf einer WeChat-Miniprogrammseite

Y2J
Freigeben: 2017-04-24 14:07:16
Original
2325 Leute haben es durchsucht

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: Seitenwertübergabe
Ich habe gerade angefangen, die Pfadparameterübergabe zu verwenden, um das Problem zu lösen, aber wie wir alle wissen:

Jeder Browser HTTP Die maximale Länge der Get-Request-URL ist nicht gleich. Die maximale Länge mehrerer häufig verwendeter Browser und die Übermittlungssituation nach Überschreitung der maximalen Länge sind wie folgt:
IE6 .0: Die maximale Länge der URL beträgt 2083 Zeichen und kann nach Überschreiten der maximalen Länge nicht übermittelt werden.
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:

Teilen Sie eine kleine Erkundung des Werttransfers auf einer WeChat-Miniprogrammseite

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: &#39;this is a template&#39;,
       time: &#39;2016-09-15&#39;
     }
    }
    })
    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.

    Das obige ist der detaillierte Inhalt vonTeilen Sie eine kleine Erkundung des Werttransfers auf einer WeChat-Miniprogrammseite. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
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