Eine Zusammenfassung der Erfahrungen bei der Entwicklung von WeChat-Miniprogrammen, die es wert ist, gelesen zu werden

Dieser Artikel stellt hauptsächlich eine Zusammenfassung der WeChat-Applet-Entwicklungserfahrungen vor, die es wert ist, gelesen zu werden. Der Herausgeber findet ihn recht gut, daher werde ich ihn jetzt mit Ihnen teilen und als Referenz verwenden. Folgen wir dem Editor und werfen wir einen Blick darauf

1: Methode zur Übergabe von Parameterwerten

1: Daten-ID

Wir können Daten-*-Attribute zu HTML-Elementen hinzufügen, um die von uns benötigten Werte zu übergeben:

(1) Daten-ID festlegen

<view class="block" bindtap="playTap" data-id="{{modle.id}}">

(2): Wert abrufen + Wert übergeben

playTap:function(e) {
    const dataset = e.currentTarget.dataset;
    wx.navigateTo({
     url: '../play/index?id='+ dataset.id
    })
    console.log(dataset.id);
  }

(3): Holen Sie sich den Wert

onLoad:function (param) {
  //页面初始化
    this.setData({
      currentId:param.id
    })
}

data-Hinweis: Der Datenname darf keine Großbuchstaben haben, nachdem ich lange gesucht habe, weil er groß geschrieben ist Buchstabe. Fehler. Das Objekt kann nicht im data-*-Attribut gespeichert werden

2: Legen Sie die ID-Methoden-ID so fest, dass der Wert übergeben wird

Verwendungsanweisungen:

(1) ID festlegen

<view bindtap=“playTap" id="{{modle.id}}">

(2) Wert erhalten

Durchkommen e .currentTarget.id Legen Sie den Wert der ID fest und übergeben Sie den Wert dann durch Festlegen des globalen Objekts

3: Parameterwert hinzufügen, der im Navigator übergeben wird

Verwendungsanweisungen

(1) Wertübergabe: Splice nach dem Navigatorattribut url?id (Parametername) = der zu übergebende Wert (wenn mehrere Parameter durch & und name=value&……. getrennt sind)

<navigator url="../my/my?id={{item.id}}" wx:for="{{modles}}">

(2) Wert:

onLoad (params){
    app.fetch(API.detail + params.id,(err,data) => {
    })
  }

Zweitens: Datenanforderungskapselung

1. Alle Schnittstellen in eine einheitliche js-Datei einfügen und exportieren

const api = {
  interface1: 'https://........',
   interface2: 'https://.......',
   interface3: 'https://....',
   .....
}
module.exports = api;

2: Erstellen Sie eine Methode zum Kapseln der Anforderungsdaten in app.js

fetch(url,data, callback) {
   wx.request({
     url,
     data: data,
     header: {
       'Content-Type': 'application/json'
     },
     success(res) {
       callback(null, res.data);
     },
     fail(e) {
       callback(e);
     }
   })
 },

3: Rufen Sie die gekapselte Methode auf der Unterseite auf, um Daten anzufordern

import API from "../../api/api.js";
const app = getApp();
const conf = {
  data:{
    title:'正在拼命加载中...',
    loadding:true
  },
  onLoad (){
    app.fetch(API.hot,{},(err,data) => {
    })
  },

Drei: Verwenden Sie Vorlagen ( Ich habe festgestellt, dass Vorlagen wirklich eine gute Sache sind!)

1: Vorlage definieren: Name Legen Sie den Namen der Vorlage fest

<template name="homecell">
   <view class="item">
  </view>
 </template>

2: Vorlage verwenden

Vorlage zuerst vorstellen

<import src="../../commonXml/homecell.wxml" />

und verwenden Sie dann die Vorlage. Geben Sie den Namen der Vorlage ein. Um Daten über Daten weiterzuleiten, müssen die Daten

<template is="homecell" data="{{item}}"></template>

sein Viertens: Die benutzerfreundlicheren Attribute und Methoden von Arrays

Die Methode Array.isArray() wird verwendet, um zu bestimmen, ob ein Wert ein Array ist. Wenn ja, wird „true“ zurückgegeben, andernfalls wird „false“ zurückgegeben.

Die Methode concat() kombiniert den eingehenden Array- oder Nicht-Array-Wert mit dem ursprünglichen Array, um ein neues Array zu bilden, und gibt es zurück.

Die Methode forEach() wird einmal für jedes Element des ausgeführt Array Die bereitgestellte Funktion (Callback-Funktion).

Die Methode „join()“ fügt alle Elemente im Array zu einer Zeichenfolge zusammen.

Die Methode „keys()“ gibt einen Iterator von Array-Indizes zurück.

Die Methode „map()“ gibt ein neues Array zurück, das aus dem Rückgabewert jedes Elements im ursprünglichen Array besteht, nachdem eine bestimmte Methode aufgerufen wurde.

Die Methode „pop()“ löscht das letzte Element in einem Array-Element und gibt dieses Element zurück.

Die Methode push() fügt ein oder mehrere Elemente am Ende des Arrays hinzu und gibt die neue Länge des Arrays (Längenattributwert) zurück.

toString() gibt einen String zurück, der das angegebene Array und seine Elemente darstellt.

Fünf: Allgemeine Objektmethoden

1 Initialisierungsmethode

var obj = [];
var obj = new obj();
var obj = Object.create(null);

2 Methoden zum Hinzufügen von Elementen

dic[“key”] = “value”;

3 Methoden zum Löschen von Schlüsseln

delete dic[“key”];

4 Alle Einträge des Wortes löschen

dic.clear();

5 Löschen

delete dic;

6 Methoden zum Anzeigen aller Attribute

Object.keys(obj);

Alle Schlüsselnamen des Objekts sind Zeichenfolgen, sodass sie hinzugefügt werden können oder nicht Wenn der Schlüsselname ein numerischer Wert ist, wird er automatisch in eine Zeichenfolge umgewandelt. Wenn der Schlüsselname jedoch nicht die Bedingungen des Identifikationsnamens erfüllt (z. B. wenn das erste Zeichen eine Zahl ist oder ein Leerzeichen enthält). oder Operator) und es sich nicht um eine Zahl handelt, müssen Anführungszeichen hinzugefügt werden, andernfalls wird ein Fehler gemeldet

7 Leseattribute

obj.name || obj['name']

Hinweis: Punktoperatoren können nicht für numerische Tastennamen verwendet werden (da sie als Dezimalpunkt behandelt werden), sondern nur der eckige Klammeroperator.

8 Überprüfen Sie, ob die Variable deklariert ist

if(obj.name) || if(obj['name'])

9 Der in-Operator wird verwendet, um zu überprüfen, ob das Objekt ein Attribut enthält, und Gibt „true“ zurück, wenn dies der Fall ist, andernfalls wird „false“ zurückgegeben

if ( ‘x' in obj) {return 1}

10 for … in Schleife

wird verwendet, um alle Eigenschaften eines Objekts zu durchlaufen

for (var i in obj) {
console.log(obj);
}

11 mit Anweisung

Funktion: Bietet etwas Schreibkomfort beim Bedienen mehrerer Attribute desselben Objekts

with(obj) {
name1 = 1;
name2 = 2;
}

entspricht

obj.name1 = 1;
obj.name2 = 2;

Das Obige ist der gesamte Inhalt dieses Artikels, I Ich hoffe, dass es für das Lernen aller hilfreich sein wird. Ich hoffe auch, dass jeder die chinesische PHP-Website unterstützt.

Das obige ist der detaillierte Inhalt vonEine Zusammenfassung der Erfahrungen bei der Entwicklung von WeChat-Miniprogrammen, die es wert ist, gelesen zu werden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!