mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
[react-interactions] Press with useRef instead of useState (#16870)
We only need to read and modify the value for the lifetime of the hook
This commit is contained in:
+15
-15
@@ -128,10 +128,10 @@ export function usePress(props: PressProps) {
|
||||
onPressStart,
|
||||
} = safeProps;
|
||||
|
||||
const [active, updateActive] = React.useState(null);
|
||||
const activeResponder = React.useRef(null);
|
||||
|
||||
const tap = useTap({
|
||||
disabled: disabled || active === 'keyboard',
|
||||
disabled: disabled || activeResponder.current === 'keyboard',
|
||||
preventDefault,
|
||||
onAuxiliaryTap(e) {
|
||||
if (onPressStart != null) {
|
||||
@@ -147,8 +147,8 @@ export function usePress(props: PressProps) {
|
||||
}
|
||||
},
|
||||
onTapStart(e) {
|
||||
if (active == null) {
|
||||
updateActive('tap');
|
||||
if (activeResponder.current == null) {
|
||||
activeResponder.current = 'tap';
|
||||
if (onPressStart != null) {
|
||||
onPressStart(createGestureState(e, 'pressstart'));
|
||||
}
|
||||
@@ -156,47 +156,47 @@ export function usePress(props: PressProps) {
|
||||
},
|
||||
onTapChange: onPressChange,
|
||||
onTapUpdate(e) {
|
||||
if (active === 'tap') {
|
||||
if (activeResponder.current === 'tap') {
|
||||
if (onPressMove != null) {
|
||||
onPressMove(createGestureState(e, 'pressmove'));
|
||||
}
|
||||
}
|
||||
},
|
||||
onTapEnd(e) {
|
||||
if (active === 'tap') {
|
||||
if (activeResponder.current === 'tap') {
|
||||
if (onPressEnd != null) {
|
||||
onPressEnd(createGestureState(e, 'pressend'));
|
||||
}
|
||||
if (onPress != null) {
|
||||
onPress(createGestureState(e, 'press'));
|
||||
}
|
||||
updateActive(null);
|
||||
activeResponder.current = null;
|
||||
}
|
||||
},
|
||||
onTapCancel(e) {
|
||||
if (active === 'tap') {
|
||||
if (activeResponder.current === 'tap') {
|
||||
if (onPressEnd != null) {
|
||||
onPressEnd(createGestureState(e, 'pressend'));
|
||||
}
|
||||
updateActive(null);
|
||||
activeResponder.current = null;
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
const keyboard = useKeyboard({
|
||||
disabled: disabled || active === 'tap',
|
||||
disabled: disabled || activeResponder.current === 'tap',
|
||||
onClick(e) {
|
||||
if (preventDefault !== false) {
|
||||
e.preventDefault();
|
||||
}
|
||||
if (active == null && onPress != null) {
|
||||
if (activeResponder.current == null && onPress != null) {
|
||||
onPress(createGestureState(e, 'press'));
|
||||
}
|
||||
},
|
||||
onKeyDown(e) {
|
||||
if (active == null && isValidKey(e)) {
|
||||
if (activeResponder.current == null && isValidKey(e)) {
|
||||
handlePreventDefault(preventDefault, e);
|
||||
updateActive('keyboard');
|
||||
activeResponder.current = 'keyboard';
|
||||
|
||||
if (onPressStart != null) {
|
||||
onPressStart(createGestureState(e, 'pressstart'));
|
||||
@@ -207,7 +207,7 @@ export function usePress(props: PressProps) {
|
||||
}
|
||||
},
|
||||
onKeyUp(e) {
|
||||
if (active === 'keyboard' && isValidKey(e)) {
|
||||
if (activeResponder.current === 'keyboard' && isValidKey(e)) {
|
||||
handlePreventDefault(preventDefault, e);
|
||||
if (onPressChange != null) {
|
||||
onPressChange(false);
|
||||
@@ -218,7 +218,7 @@ export function usePress(props: PressProps) {
|
||||
if (onPress != null) {
|
||||
onPress(createGestureState(e, 'press'));
|
||||
}
|
||||
updateActive(null);
|
||||
activeResponder.current = null;
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -104,7 +104,7 @@ function createPointerEvent(
|
||||
ctrlKey,
|
||||
detail,
|
||||
getModifierState(keyArg) {
|
||||
createGetModifierState(keyArg, modifierState);
|
||||
return createGetModifierState(keyArg, modifierState);
|
||||
},
|
||||
height: isMouse ? 1 : height != null ? height : defaultPointerSize,
|
||||
metaKey,
|
||||
@@ -150,7 +150,7 @@ function createKeyboardEvent(
|
||||
altKey,
|
||||
ctrlKey,
|
||||
getModifierState(keyArg) {
|
||||
createGetModifierState(keyArg, modifierState);
|
||||
return createGetModifierState(keyArg, modifierState);
|
||||
},
|
||||
isComposing,
|
||||
key,
|
||||
@@ -193,7 +193,7 @@ function createMouseEvent(
|
||||
ctrlKey,
|
||||
detail,
|
||||
getModifierState(keyArg) {
|
||||
createGetModifierState(keyArg, modifierState);
|
||||
return createGetModifierState(keyArg, modifierState);
|
||||
},
|
||||
metaKey,
|
||||
movementX,
|
||||
|
||||
Reference in New Issue
Block a user