Wir stellen drei Miniprogramm-Events vor

Zusammenfassung: In diesem Artikel wird die Verwendung des WeChat-Applets Ereignis vorgestellt. 1: Das Ereignis erscheint im WeChat-Applet-Entwicklungstool. Erstellen Sie einen neuen Ereignisordner, erstellen Sie eine neue Datei und geben Sie den folgenden Code in event.wxml ein: viewclass=view1bindtap=view1clickid=view1 data -title=Nachrichtentitel data-id=100 Hier...

In diesem Artikel wird die Verwendung von WeChat-Miniprogrammereignissen vorgestellt.

1: Ereignis sprudelt

in WeChatErstellen Sie im Mini-Programmentwicklungstool einen neuen Ereignisordner, eine neue Datei und geben Sie den folgenden Code in event.wxml ein:

1. <view  class="view1"  bindtap="view1click"  id="view1" data-title="新闻标题"  data-id="100">
     这里是view 1
       <view class="view2" bindtap="view2click" id="view2">
            这里是view 2
             <view class="view3" bindtap="view3click" id="view3">
                  这里是view 3
             </view>
       </view>
   </view>

Füllen Sie den folgenden Code in event.wxss aus:

.view1{
  height: 500rpx;
  width: 100%;
  background-color:beige;
}
.view2{
  height: 400rpx;
  width: 80%;
  background-color: red;
}

1. .view3{
     height: 300rpx;
     width: 60%;
     background-color:aqua;
   }

Fügen Sie den folgenden Code zu event.js hinzu:

1. //事件处理函数
     view1click : function(event){
       console.log("view1click")
     },
     view2click : function(){
       console.log("view2click")
     },
     view3click : function(event){
        console.log("view3click")
     },

Kompilieren und ausführen, dann auf „Anzeigen“ klicken3 Bereichsergebnis im Simulator Wie in Abbildung 1 dargestellt: Sie können sehen, dass zusätzlich zu Ansicht3 auch die Klickereignisse von Ansicht2 und Ansicht1 reagiert haben. Dies ist das Klickereignis-Blubbern

Abbildung 1

2: Blockierende Ereignisse Sprudeln

wird

1. <view class="view3" bindtap="view3click" id="view3">

geändert zu

1. <view class="view3" catchtap="view3click" id="view3">

--- wird geändert in: catchtap

Anderer Code bleibt unverändert, kompilieren und Führen Sie den Vorgang aus oder klicken Sie auf den Bereich „Ansicht 3“ und überprüfen Sie die Protokollinformationen. Wie in Abbildung 2 dargestellt, sprudelt das Ereignis nicht mehr weiter >

Abbildung 2

3: Eingehende Ereignisinformationen

Im obigen Code: view1click: function(event)Fügen Sie den Code zum Drucken der eingehenden Ereignisereignisinformationen wie folgt hinzu: Kompilieren und Führen Sie den Vorgang wie in Abbildung 3 gezeigt aus:

1. view1click : function(event){
       console.log("view1click")
       console.log(event)
     }

Abbildung 3

Der Datensatz enthält das benutzerdefinierte

Attribut, ID: 100 , Titel: „News Title“, Dieses benutzerdefinierte Attribut wird im folgenden Code festgelegt:

[Verwandte Empfehlungen]

1. Besondere Empfehlung: Version „php Programmer Toolbox“ V0.1 herunterladen

2.WeChat-Applet vollständiger Quellcode-Download

3. Demo des WeChat-Miniprogramms: Imitation Mall

Das obige ist der detaillierte Inhalt vonWir stellen drei Miniprogramm-Events vor. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!