Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

230
Vistas
Having problem: this.setState is not a function

I'm having an issue, where I can't input text when I run my app, due to "this.setState is not a function". I am practicing react.js.

I have no idea about the problem here, I'm new to react and couldn't figure out how to use bind to overcome this problem so I decided to ask here. First post ever!

Uncaught TypeError: this.SetState is not a function

constructor(props){super(props);
    this.state = {
        db: '',
        username: '',
        fullname: '',
        phonenumber: '',
        dob: ''



    }  
    this.interface = this.interface.bind(this);


}

componentDidMount(){
  
    this.setState({
        db: StartFirebase()
    });
}

render(){
    return(
    
        <>
        <label>Enter Username</label>
        <input type='text' id="userbox" value={this.state.username} 
        onChange={e => {this.SetState({username: e.target.value});}}/>
        <br></br>

        <label>Enter Fullname</label>
        <input type='text' id="namebox" value={this.state.username} 
        onChange={e => {this.SetState({username: e.target.value});}}/>
        <br></br>

        <label>Enter Phonenumber</label>
        <input type='text' id="phonebox" value={this.state.username} 
        onChange={e => {this.SetState({username: e.target.value});}}/>
        <br></br>

        <label>Choose Day of Birth</label>
        <input type='text' id="datebox" value={this.state.username} 
        onChange={e => {this.SetState({username: e.target.value});}}/>
        <br></br>

        <button id="addBtn" onClick={this.interface}>Add Data</button>
        <button id="updateBtn" onClick={this.interface}>Update Data</button>
        <button id="deleteBtn" onClick={this.interface}>Delete Data</button>
        <button id="SelectBtn" onClick={this.interface}>Get Data from DB</button>

        
        </>
    )
}

interface(event){
    const id = event.target.id

    if(id=='AddBtn'){
        this.insertData();
    }

    else if(id=='updateBtn'){
      //  this.insertData();
     
    }
    else if(id=='DeleteBtn'){
      //  this.insertData();
     
    }
    else if(id=='selectBtn'){
       // this.insertData();
     
    }
}

GetAllInputs(){
    return {
        username: this.state.username,
        name: this.state.fullname,
        phone: Number(this.state.phonenumber),
        dob: this.state.dob
    }
}
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

try change SetState to setState

constructor(props){super(props);
    this.state = {
        db: '',
        username: '',
        fullname: '',
        phonenumber: '',
        dob: ''



    }  
    this.interface = this.interface.bind(this);


}

componentDidMount(){
  
    this.setState({
        db: StartFirebase()
    });
}

render(){
    return(
    
        <>
        <label>Enter Username</label>
        <input type='text' id="userbox" value={this.state.username} 
        onChange={e => {this.setState({username: e.target.value});}}/>
        <br></br>

        <label>Enter Fullname</label>
        <input type='text' id="namebox" value={this.state.username} 
        onChange={e => {this.setState({username: e.target.value});}}/>
        <br></br>

        <label>Enter Phonenumber</label>
        <input type='text' id="phonebox" value={this.state.username} 
        onChange={e => {this.setState({username: e.target.value});}}/>
        <br></br>

        <label>Choose Day of Birth</label>
        <input type='text' id="datebox" value={this.state.username} 
        onChange={e => {this.setState({username: e.target.value});}}/>
        <br></br>

        <button id="addBtn" onClick={this.interface}>Add Data</button>
        <button id="updateBtn" onClick={this.interface}>Update Data</button>
        <button id="deleteBtn" onClick={this.interface}>Delete Data</button>
        <button id="SelectBtn" onClick={this.interface}>Get Data from DB</button>

        
        </>
    )
}

interface(event){
    const id = event.target.id

    if(id=='AddBtn'){
        this.insertData();
    }

    else if(id=='updateBtn'){
      //  this.insertData();
     
    }
    else if(id=='DeleteBtn'){
      //  this.insertData();
     
    }
    else if(id=='selectBtn'){
       // this.insertData();
     
    }
}

GetAllInputs(){
    return {
        username: this.state.username,
        name: this.state.fullname,
        phone: Number(this.state.phonenumber),
        dob: this.state.dob
    }
}
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda