# wx-touch-event

> 微信小程序 手势事件库

Latest version **1.0.1** (published 2017-05-01) · ISC license · 0 weekly downloads

## Install

```sh
npm install wx-touch-event
pnpm add wx-touch-event
yarn add wx-touch-event
bun add wx-touch-event
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2017-05-01 |
| First published | 2017-05-01 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 129 |
| Author | zqbright |
| Maintainers | zqbright |
| Keywords | wx, wechat, event, touch |

## Links

- npm: https://www.npmjs.com/package/wx-touch-event
- Repository: https://github.com/qbright/wx-touch-event
- Homepage: https://github.com/qbright/wx-touch-event#readme
- Issues: https://github.com/qbright/wx-touch-event/issues
- npm.io page: https://npm.io/package/wx-touch-event

## Alternatives

- [async-exit-hook](https://npm.io/package/async-exit-hook.md) — 3.7M weekly downloads
- [evnty](https://npm.io/package/evnty.md) — 7.2K weekly downloads
- [eleventy-plugin-asciidoc](https://npm.io/package/eleventy-plugin-asciidoc.md) — 3.5K weekly downloads
- [@jswork/next-get2get](https://npm.io/package/@jswork/next-get2get.md) — 945 weekly downloads
- [@dashersw/axon](https://npm.io/package/@dashersw/axon.md) — 934 weekly downloads

## Recent versions

- 1.0.1 (latest) — 2017-05-01
- 1.0.0 — 2017-05-01

## README

##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


###使用
由于和微信小程序强绑定，因此需要在元素上面绑定好所有的事件，书写比较麻烦，因此建议对于原生支持的使用原生去解决，
只有当需要 pinch，rotate,swipe 等特殊事件才使用这个事件库实现

> 安装 `npm i wx-touch-event --save` , 或者直接从 git 库 checkout 出来 

绑定方法
#### \*.wxml
在`wxml`中对需要监听时间的元素绑定 `touchstart、touchmove、touchend、touchcancel`四个事件
页面书写成

``` 
    <view class="info-list" 
          bindtouchstart="touchStart"
          bindtouchmove="touchMove"
          bindtouchend="touchEnd"
          bindtouchcancel="touchCancel"
        >
        
    </view>
```

#### \*.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),

});
```

---
_Source: https://npm.io/package/wx-touch-event · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._