資訊專欄INFORMATION COLUMN
摘要：微信小程序手勢事件庫由于微信小程序只能夠支持時間，對于比較復雜的事件只能自己實現因此自己對庫進行了改造，開發了時候微信小程序手勢事件庫使用進行編寫手勢庫支持以下事件倉庫地址點我點我使用由于和微信小程序強綁定，因此需要在元素上面綁定好所有的事
WxTouchEvent 微信小程序手勢事件庫
由于微信小程序只能夠支持 tap,longtap,touchstart,touchmove,touchcancel,touchend時間，對于比較復雜的事件只能自己實現
因此自己對 alloyFinger庫進行了改造，開發了時候微信小程序手勢事件庫WxTouchEvent,使用 ES
6進行編寫,手勢庫支持以下事件
touchStart
touchMove
touchEnd
touchCancel
multipointStart
multipointEnd
tap
doubleTap
longTap
singleTap
rotate
pinch
pressMove
swipe
git倉庫地址:點我點我
使用由于和微信小程序強綁定，因此需要在元素上面綁定好所有的事件，書寫比較麻煩，因此建議對于原生支持的使用原生去解決，
只有當需要 pinch，rotate,swipe 等特殊事件才使用這個事件庫實現
安裝 npm i wx-touch-event --save , 或者直接從 git 庫 checkout 出來
綁定方法
*.wxml在wxml中對需要監聽時間的元素綁定 touchstart、touchmove、touchend、touchcancel四個事件
頁面書寫成
*.js
在js邏輯層需要實例化WxTouchEvent, 實例中有start、move、end、cancel對應*.wxml綁定的bindtouchstart,bindtouchmove,bindtouchend,bindtouchcancel,需要將事件的回調函數一一對應,
書寫成:
import WxTouchEvent from "wx-touch-event";
let infoListTouchEvent = new WxTouchEvent();//在 Page外實例化函數，可以直接復制給 Page 中的回調函數
Page({
onLoad: function() {
this.infoListTouchEvent = infoListTouchEvent;
this.infoListTouchEvent.bind({//初始化后綁定事件
swipe: function(e) {
console.log(e);
},
doubleTap: function(e) {
console.log(e);
},
tap: function(e) {
console.log(e);
}.bind(this),
longTap: function(e) {
console.log(e);
},
rotate: function(e) {
console.log(e)
}.bind(this),
pinch: function(e) {
console.log(e);
}
})
},
touchStart: infoListTouchEvent.start.bind(infoListTouchEvent),
touchMove: infoListTouchEvent.move.bind(infoListTouchEvent),
touchEnd: infoListTouchEvent.end.bind(infoListTouchEvent),
touchCancel: infoListTouchEvent.cancel.bind(infoListTouchEvent),
});
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/82778.html
摘要：自制微信小程序通訊起因現在微信小程序開發基本會使用到組件的開發。隨著組件的不斷增加，使得組件之間的通訊越發頻繁。這個能使得我們在組件和頁面之間隨意通訊，您只需要按照規范注冊，使用即可，可以幫你建立任意兩個組件之間的通信通道。 自制微信小程序通訊JS 起因 現在微信小程序開發基本會使用到組件的開發。隨著組件的不斷增加，使得組件之間的通訊越發頻繁。然后，微信小程序中組件之前通訊必須通過父子...
摘要：學習微信小程序一段時間，自己仿照京東小程序做了幾個頁面，分享給大家看看源碼地址，希望能幫助到有興趣的同學喜歡可以加星哦其中幾個效果圖如下介紹一下事先準備的事情前期部署項目命名規范用駝峰法命名中命名用分隔，用接口中數據用分隔文件文件夾命名 學習微信小程序一段時間，自己仿照京東小程序做了幾個demo頁面，分享給大家看看 源碼地址，希望能幫助到有興趣的同學https://github.com...
摘要：學習微信小程序一段時間，自己仿照京東小程序做了幾個頁面，分享給大家看看源碼地址，希望能幫助到有興趣的同學喜歡可以加星哦其中幾個效果圖如下介紹一下事先準備的事情前期部署項目命名規范用駝峰法命名中命名用分隔，用接口中數據用分隔文件文件夾命名 學習微信小程序一段時間，自己仿照京東小程序做了幾個demo頁面，分享給大家看看 源碼地址，希望能幫助到有興趣的同學https://github.com...
閱讀 1417·2021-11-09 09:45
閱讀 1785·2021-11-04 16:09
閱讀 1449·2021-10-14 09:43
閱讀 1814·2021-09-22 15:24
閱讀 1589·2021-09-07 10:06
閱讀 1597·2019-08-30 14:15
閱讀 980·2019-08-30 12:56
閱讀 1563·2019-08-29 17:22
