微信小程序中事件

微信小程序中事件

一.常見的事件有

類型 觸發條件 最低版本
touchstart 手指觸摸動做開始
touchmove 手指觸摸後移動
touchcancel 手指觸摸動做被打斷,如來電提醒,彈窗
touchend 手指觸摸動做結束
tap 手指觸摸後立刻離開
longpress 手指觸摸後,超過350ms再離開,若是指定了事件回調函數並觸發了這個事件,tap事件將不被觸發 1.5.0
longtap 手指觸摸後,超過350ms再離開(推薦使用longpress事件代替)
transitionend 會在 WXSS transition 或 wx.createAnimation 動畫結束後觸發
animationstart 會在一個 WXSS animation 動畫開始時觸發
animationiteration 會在一個 WXSS animation 一次迭代結束時觸發
animationend 會在一個 WXSS animation 動畫完成時觸發
touchforcechange 在支持 3D Touch 的 iPhone 設備,重按時會觸發

有兩個注意點html

Touchcancle: 在某些特定場景下才會觸發(好比來電打斷等)

​ tap事件和longpress事件一般只會觸發其中一個python

二.書寫方式

頁面中

不須要傳參的事件

<!--寫法一 bind事件名='函數名' -->
<button bindtap="fuck">點我</button>
<!--寫法一 bind:事件名='函數名' -->

須要傳參的事件

<!-- 點擊傳參data-傳過去的key='變量值' -->
<button bindtap="fuck_1" data-name="ywy">傳參</button>
<!-- 點擊傳變量data-傳過去的key='{{變量名}}' -->
<button bindtap="fuck_2" data-number='{{a}}'>{{a}}</button>

js文件中

fuck:function(){
    console.log('1111111')
  },
  fuck_1: function (data) {
   console.log(data)
  },
  fuck_2: function (e) {
    console.log(e)
  },

三.有傳參的事件取值

事件傳遞參數

當視圖層發生事件時,某些狀況須要事件攜帶一些參數到執行的函數中, 這個時候就能夠經過小程序

data-屬性來完成:微信小程序

1 格式:data-屬性的名稱微信

2 獲取:e.currentTarget.dataset.屬性的名稱函數

currentTarget和target的區別

這個區別普通的標籤看不出來,可是一旦有標籤的父標籤頁有一個事件時候,這時候就有區別,currentTarget指向的是自己的函數調用傳的參數,而target不是動畫

四.傳參和定義變量之間的操做

頁面中js
  func:function(e){
    this.setData({
        變量名:this.data.變量名++
    })
  },
相關文章
相關標籤/搜索