kylefang/react-native-web
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native-web.git synced 2026-04-28 12:24:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

[fix] PanResponder grant firing twice on touch devices

Browse Source 
Touch events can produce trailing mouse events, which cause unwanted
events to fire in the responder event system.  This issue is avoided in
`Touchable` by cancelling the event in the responder release callback.
To fix the issue in other areas, like the PaneResponder, this hack is
moved into `createElement` and applied to event `onResponderRelease`
callback.

Fix #802
This commit is contained in:
Nicolas Gallagher
2018-02-18 16:10:44 -08:00
parent e5adc5a37c
commit 893963a799
2 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/react-native-web/src/exports/Touchable/index.js vendored
View File

@@ -424,13 +424,6 @@ const TouchableMixin = {
*/
touchableHandleResponderRelease: function(e: Event) {
this._receiveSignal(Signals.RESPONDER_RELEASE, e);
// Browsers fire mouse events after touch events. This causes the
// 'onResponderRelease' handler to be called twice for Touchables.
// Auto-fix this issue by calling 'preventDefault' to cancel the mouse
// events.
if (e.cancelable && !e.isDefaultPrevented()) {
e.preventDefault();
}
},
/**

11
packages/react-native-web/src/exports/createElement/index.js vendored
View File

@@ -52,6 +52,17 @@ const adjustProps = domProps => {
if (isEventHandler) {
if (isButtonRole && isDisabled) {
domProps[propName] = undefined;
} else if (propName === 'onResponderRelease') {
// Browsers fire mouse events after touch events. This causes the
// 'onResponderRelease' handler to be called twice for Touchables.
// Auto-fix this issue by calling 'preventDefault' to cancel the mouse
// events.
domProps[propName] = e => {
if (e.cancelable && !e.isDefaultPrevented()) {
e.preventDefault();
}
return prop(e);
};
} else {
// TODO: move this out of the render path
domProps[propName] = e => {