Contador v.2


import React, { Component } from 'react'
import logo from './logo.svg'
import './App.css'

class Counter extends React.Component {
  constructor(props){
    super(props)
    this.state = {
      value: 0
    };
  }
  
  incrementar = () => {
    if (this.state.value<this.props.maximo){
    this.setState({value:this.state.value+1})
  }
  };
  decrementar = () => {
    if (this.state.value>0){
    this.setState({value:this.state.value-1})
  }
  };
  reset=()=>{
    this.setState({value:0})
  }
  multiplicar=()=>{
    this.setState({value:this.state.value*200})
  }
  render() {
    return (
      <div>
        <h2>{this.state.value}</h2>
        <button onClick={this.decrementar}>Decrementar</button>
        <button onClick={this.incrementar}>Incrementar</button>
        <button onClick={this.reset}>Reset</button>
        <button onClick={this.multiplicar}>Multiplicar</button>
      </div>
    );
  }
}

export default function App() {
  return <Counter maximo="20"/>;
}

Publicado por

Juan Pablo Fuentes

Formador de programación y bases de datos