React Hooks Example: Timer

Simple React Hooks example. A timer that pauses when you hold the mouse button. Creates and uses a custom Hook.

by Paco86

HTML

<div id="app"></div>

CSS

.timer {
  padding: 20px;
  font-size: 40px;
}

React

function useDebounce(fn, time) {
  return debounce(fn, time);
}

const App = () => {
	const [counter, setCounter] = React.useState(0);

  const handleClick = useDebounce(function() {
    setCounter(counter + 1)
  }, 1000)

  return <div style={{ padding: 30 }}>
    <Button
      onClick={handleClick}
    >click</Button>
    <div>{counter}</div>
  </div>


};

ReactDOM.render(<App />, document.querySelector("#app"))