/Javascript/React/Automated counter with react hooks

Automated counter with react hooks

Counter with react hooks

import React, { useState } from 'react';

function Example() {
  // Declaración de una variable de estado que llamaremos "count"  const [count, setCount] = useState(0);
  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}

Source: es.reactjs.org

Automated counter with react hooks

const { useState, useEffect, useRef } = React;

function useInterval(callback, delay) {
  const savedCallback = useRef();

  // Remember the latest callback.
  useEffect(() => {
    savedCallback.current = callback;
  }, [callback]);

  // Set up the interval.
  useEffect(() => {
    let id = setInterval(() => {
      savedCallback.current();
    }, delay);
    return () => clearInterval(id);
  }, [delay]);
}

function App() {
  const [counter, setCounter] = useState(0);

  useInterval(() => {
    setCounter(counter + 1);
  }, 1000);

  return <h1>{counter}</h1>;
};

ReactDOM.render(
  <App />,
  document.getElementById('root')
);

Source: stackoverflow.com

Similar codes

0 vote104 views1 answer
Pagination hook react
Javascript React
0 vote111 views1 answer
Select checkbox raitng in order javascript React
Javascript React
13 votes106 views1 answer
React js vs jsx
Javascript React
0 vote109 views1 answer
Custom react native product rating
Javascript React
0 vote104 views2 answers
Editable pre input react
Javascript React
0 vote105 views1 answer
How to detect if ios is in dark mode react native
Javascript React
12 votes59 views3 answers
React form hook npm
Javascript React
103 votes120 views7 answers
How to create react app
Javascript React
0 vote112 views1 answer
React js how to do array range
Javascript React
0 vote113 views1 answer
Javascript react useState update object
Javascript React