/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

2 votes281 views1 answer
React concatenate string and component
Javascript React
0 vote276 views1 answer
React native navigation shared element
Javascript React
15 votes253 views3 answers
React native expo navigation
Javascript React
16 votes263 views6 answers
React useState hook
Javascript React
0 vote297 views1 answer
How to remove elevation tab bar react native
Javascript React
7 votes274 views2 answers
React native password input
Javascript React
1 vote267 views1 answer
React-redux imports
Javascript React
2 votes293 views1 answer
React allow only numbers in input
Javascript React
0 vote272 views1 answer
How to disable reactive form submit button in Angular
Javascript React
1 vote277 views1 answer
Font awesome react native icons
Javascript React