Heim > WeChat-Applet > Mini-Programmentwicklung > Veranstaltungen des WeChat-Miniprogramms

Veranstaltungen des WeChat-Miniprogramms

高洛峰
Freigeben: 2017-03-01 11:43:15
Original
1534 Leute haben es durchsucht

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

1: Ereignissprudeln

Erstellen Sie im WeChat-Applet-Entwicklungstool einen neuen Ereignisordner, eine neue Datei und geben Sie den folgenden Code in event.wxml ein:

<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>
Nach dem Login kopieren


Fügen Sie den folgenden Code in event.wxss ein:

.view1{
  height: 500rpx;
  width: 100%;
  background-color:beige;
}
Nach dem Login kopieren
.view2{
  height: 400rpx;
  width: 80%;
  background-color: red;
}
Nach dem Login kopieren
.view3{
  height: 300rpx;
  width: 60%;
  background-color:aqua;
}
Nach dem Login kopieren

Fügen Sie den folgenden Code in event.wxss ein .js:

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

Kompilieren und ausführen und dann im Simulator auf den Bereich view3 klicken. Das Ergebnis ist in Abbildung 1 dargestellt: Sie können sehen, dass zusätzlich zu view3 auch die Klickereignisse von view2 und view1 vorhanden sind haben geantwortet. Dies ist das Klick-Ereignis

 微信小程序事件

2: Um das Sprudeln des Ereignisses zu verhindern, ändern Sie

in
<view class="view3" bindtap="view3click" id="view3">
Nach dem Login kopieren

---Ändern Sie es in: Catchtap
<view class="view3" catchtap="view3click" id="view3">
Nach dem Login kopieren

Anderer Code bleibt unverändert, kompilieren und ausführen, oder klicken Sie auf den View3-Bereich, um die Protokollinformationen anzuzeigen, wie in Abbildung 2 gezeigt, die Ereignis-Nr längere Blasen

 微信小程序事件3: Ereignisinformationen werden übergeben


Im obigen Code: view1click: function(event) fügt den Code zum Drucken der hinzu Informationen zu eingehenden Ereignissen wie folgt: Kompilieren und ausführen, wie in Abbildung 3 dargestellt:

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

    console.log(event)

  }
Nach dem Login kopieren

 微信小程序事件Der Datensatz enthält benutzerdefinierte Attribute, ID: 100, Titel: „News Title“ , dieses benutzerdefinierte Attribut wird im folgenden Code festgelegt:

Weitere Artikel zu WeChat-Miniprogrammereignissen finden Sie auf der chinesischen PHP-Website!
<view  class="view1"  bindtap="view1click"  id="view1" data-title="新闻标题"  data-id="100">
Nach dem Login kopieren
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