{"id":20698792,"url":"https://github.com/rwson/reacttoucher","last_synced_at":"2026-04-20T17:30:50.869Z","repository":{"id":57171441,"uuid":"67129425","full_name":"rwson/ReactToucher","owner":"rwson","description":"Toucher的React版npm包","archived":false,"fork":false,"pushed_at":"2017-02-14T01:06:36.000Z","size":622,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-02T08:42:03.576Z","etag":null,"topics":["event-hanlder","mobile-web","react"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rwson.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-09-01T12:32:59.000Z","updated_at":"2021-07-11T13:57:56.000Z","dependencies_parsed_at":"2022-08-27T12:02:15.440Z","dependency_job_id":null,"html_url":"https://github.com/rwson/ReactToucher","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FReactToucher","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FReactToucher/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FReactToucher/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FReactToucher/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rwson","download_url":"https://codeload.github.com/rwson/ReactToucher/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242967687,"owners_count":20214280,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["event-hanlder","mobile-web","react"],"created_at":"2024-11-17T00:26:53.154Z","updated_at":"2025-12-06T17:00:59.212Z","avatar_url":"https://github.com/rwson.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"### ReactToucher\n\nReact手势管理系统\n\n----\n\n#### Usage\n\n    npm install ReactToucher --save\n\n    //  ...\n\n    import React,{ Component } from \"react\";\n    import ReactDOM from \"react-dom\";\n    import ReactToucher from \"ReactToucher\";\n    \n    class App extend Component {\n        \n        constructor(props) {\n            super(props);\n        }\n        \n        handleSwipe() {\n            //  ...\n        }\n        \n        handleLongTap() {\n            //  ...\n        }\n        \n        render() {\n            const config={\n                event: {\n                    longTap: {\n                        el: '.div',\n                        handler: this.handleLongTap.bind(this)\n                    },\n                    swipe: this.handleSwipe.bind(this)\n                },\n                cfg:{\n                    longTapTime: 700\n                }\n            };\n\n            return (\n                \u003cdiv\u003e\n                    \u003cReactToucher config={config}\u003e\n                        \u003cdiv className=\"div\"\u003e\u003c/div\u003e\n                        \u003cdiv className=\"div\"\u003e\u003c/div\u003e\n                    \u003c/ReactToucher\u003e\n                \u003c/div\u003e\n            );\n        }\n    }\n    \n    ReactDOM.rander(\u003cApp /\u003e, document.querySelector(\"#app\"));\n\n#### 支持事件类型\n\nsingleTap\n\nlongTap\n\nswipe\n\nswipeStart\n\nswipeEnd\n\nswipeUp\n\nswipeRight\n\nswipeDown\n\nswipeLeft\n\npinch\n\nrotate\n\n\n在传入事件回调的时候,需要在组件中用\n\n    this.xxxMethod.bind(this)\n\n否则,如果在该方法中用会导致this指向window的问题\n\n#### 所有的可选参数\n\n- **config**\n\n名称 | 意义 | 类型 | 可选 | 默认\n---|---|---|---|---\nsingleTap | 轻击屏幕配置 | Function/Object | 是 | NA\nlongTap | 长按回调 | Function/Object | 是 | NA\nswipe | 手指在屏幕滑动过程回调 | Function/Object | 是 | NA\nswipeStart | 手指开始滑动回调 | Function/Object | 是 | NA\nswipeEnd | 结束滑动过程回调 | Function/Object | 是 | NA\nswipeUp | 上滑 | Function/Object | 是 | NA\nswipeRight | 右滑 | Function/Object | 是 | NA\nswipeDown | 下滑 | Function/Object | 是 | NA\nswipeLeft | 左滑 | Function/Object | 是 | NA\npinch | 缩放 | Function/Object | 是 | NA\nrotate | 旋转 | Function/Object | 是 | NA\n\n当该事件对应的配置项是Object的时候,必须传入el和handler属性,否则该配置项无效,且handler的触发条件是事件的作用在el对应的元素上\n\n- **cfg**\n\n名称 | 意义 | 类型 | 可选 | 默认\n---|---|---|---|---\nlongTapTime | 手指按下不动多久(ms)触发长按事件 | Number | 是 | 700\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frwson%2Freacttoucher","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frwson%2Freacttoucher","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frwson%2Freacttoucher/lists"}