Interacción estados padres e hijos

import React, { useState } from 'react';
import Numero from './Numero'
const Contador = () => {
    // Quiero variables dentro de una página de react tengo que utilizar estado
    const [contador, setContador] = useState(0);
    const [cadena, setCadena] = useState("")
  
    
    const incrementarContador = () => {
        setContador(contador + 1);
        setCadena("")
    };
    const decrementarContador = () => {
        if (contador>0) {
            setContador(contador - 1);
            
        }else{
            setCadena("No puedes poner número negativos")
        }
        
    };
    const resetearContador = () => {
        setContador(0);
        setCadena("")
    };
    return (
        <div>
            <Numero numero={contador} resetear={resetearContador}/>
            <p> {cadena}</p>
            <button onClick={incrementarContador}>Incrementar</button>
            <button onClick={decrementarContador}>Decrementar</button>
            <button onClick={() => setContador(0)}>Reset</button>
        </div>
    );
};
export default Contador;
import './Numero.css'

function Numero({ numero, resetear }) {
    return <h1 onClick={resetear}>{numero}</h1>
}

export default Numero;

Publicado por

Avatar del usuario

Juan Pablo Fuentes

Formador de programación y bases de datos