/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

1 vote149 views1 answer
How to change the value of state in react
Javascript React
32 votes212 views6 answers
Font awesome react
Javascript React
21 votes223 views4 answers
React font awesome npm
Javascript React
0 vote217 views1 answer
React native font awesome
Javascript React
0 vote207 views1 answer
Libraries like html-react-parser
Javascript React
0 vote218 views1 answer
React first click not working
Javascript React
0 vote170 views1 answer
Undefined is not a function (near '...(0, _reactNative.createStackNavigator)...')
Javascript React
1 vote221 views1 answer
React variable in stirng
Javascript React
5 votes216 views3 answers
Get url react
Javascript React
0 vote223 views1 answer
How to add autoserial number in react js
Javascript React