/Javascript/React/Prevent double tap in react native

Prevent double tap in react native

import debounce from 'lodash.debounce'; // 4.0.8

const withPreventDoubleClick = (WrappedComponent) => {

  class PreventDoubleClick extends React.PureComponent {

    debouncedOnPress = () => {
      this.props.onPress && this.props.onPress();
    }

    onPress = debounce(this.debouncedOnPress, 300, { leading: true, trailing: false });

    render() {
      return <WrappedComponent {...this.props} onPress={this.onPress} />;
    }
  }

  PreventDoubleClick.displayName = `withPreventDoubleClick(${WrappedComponent.displayName ||WrappedComponent.name})`
  return PreventDoubleClick;
}

Source: stackoverflow.com

Similar codes

3 votes364 views3 answers
Adding donet chart text center in react
Javascript React
9 votes314 views3 answers
React Hook "useState" is called in function "app" which is neither a React function component or a custom React Hook function react-hooks/rules-of-hooks
Javascript React
21 votes332 views4 answers
React font awesome npm
Javascript React
21 votes327 views6 answers
React native vector icons
Javascript React
1 vote354 views1 answer
How to setup React Context, useContext Hook
Javascript React
1 vote342 views1 answer
React native modal not full screen
Javascript React
8 votes352 views2 answers
Set value as object in react hooks
Javascript React
0 vote306 views1 answer
React native npm run start port
Javascript React
0 vote288 views3 answers
How to use keyextractor in flatlist react native
Javascript React
1 vote400 views1 answer
Module not found: Can't resolve 'C:\Users\{user}\Documents\React apps\{app-name}\node_modules\react-scripts\node_modules\babel-loader\lib\index.js'
Javascript React