Onclick hold react

import { useState, useEffect, useCallback } from 'react';

export default function useLongPress(callback = () => {}, ms = 300) {
  const [startLongPress, setStartLongPress] = useState(false);

  useEffect(() => {
    let timerId;
    if (startLongPress) {
      timerId = setTimeout(callback, ms);
    } else {
      clearTimeout(timerId);
    }

    return () => {
      clearTimeout(timerId);
    };
  }, [callback, ms, startLongPress]);

  const start = useCallback(() => {
    setStartLongPress(true);
  }, []);
  const stop = useCallback(() => {
    setStartLongPress(false);
  }, []);

  return {
    onMouseDown: start,
    onMouseUp: stop,
    onMouseLeave: stop,
    onTouchStart: start,
    onTouchEnd: stop,
  };
}

Source: stackoverflow.com

Similar codes

1 vote215 views1 answer
React-native-infinite-scroll-with-flatlist
Javascript React
0 vote210 views1 answer
Toggle boolean state react
Javascript React
-1 vote214 views1 answer
React-native run-ios command
Javascript React
0 vote201 views1 answer
Dynamic classname react
Javascript React
0 vote212 views1 answer
React native style variable
Javascript React
0 vote312 views1 answer
When reload the page the route gone in react js laravel
Javascript React
0 vote217 views1 answer
Web-vitals react
Javascript React
0 vote203 views2 answers
React import image with url
Javascript React
36 votes188 views2 answers
How to install react router dom version 5
Javascript React
0 vote223 views1 answer
Can i open native video playback for both (Androidt / IOS) With React Native?
Javascript React