APP常??梢钥吹诫p擊底部的某個menu,頁面就會刷新。這是一種常見的操作。但如果開發(fā)者使用uniapp或者小程序,會發(fā)現(xiàn),底部的tabbar是在page.json文件中配置的,但官方的api只提供了單擊事件的監(jiān)聽,雙擊事件是沒有的。當然有些人可能會用第三方ui框架來代替默認的導航,但實際上從性能來講,還是默認的比較好,所以既然選擇默認的tabbar,那怎么去展示出雙擊tabbar這個操作呢?原理簡單:
在官方給的監(jiān)聽點擊tabar的事件中做個操作,即在某個事件段內(nèi)沒有第二次點擊,就當做是單擊,一般時間設置為200ms,比較符合用戶雙擊事件的時間。
代碼如下:
onTabItemTap(e) { // tab 點擊時執(zhí)行,此處直接接收單擊事件
if (this.tabClick) {
// 200ms 內(nèi)再次點擊 數(shù)據(jù)處理
this.reflesh() //數(shù)據(jù)處理
}
this.tabClick = true
setTimeout(() => {
this.tabClick = false // 200ms 內(nèi)沒有第二次點擊,就當作單擊
}, 200)
},
當然還有其他思路,但原理基本都是在一定的時間的間隔去執(zhí)行不同的事件,這樣便可處理單擊,雙擊以及多次點擊的事件。