this.state null reaktres bileşeni içinde

Question

Sadece basit bir şey sadece handle.submit işlevinde this.state.validForm yazdırma gibi basit bir şey deniyorum, ancak bu.state.validForm erişmek için görünmüyor olabilir. İlk önce doğrudan bu işlevle denedim, ama boşuna. Tepki vermek için yeniyim.

import React, { Component } from 'react'; 
import TextInput from './TextInput'; 

class RequestForm extends Component { 
    constructor(props) { 
     super(props); 
     this.state = {validForm : "false"}; 
     this.getInfoForm = this.getInfoForm.bind(this); 
    } 

    getInfoForm() { 
     return this.state.validForm; 
    } 

    handleSubmit(event) { 
     event.preventDefault(); 
     console.log('submit values are'); 
     console.log(event.target.src.value); 
     console.log(event.target.email.value); 
     console.log(this.state.validForm); 
     console.log(this.getInfoForm()); 
    } 

    render() { 
     return (
      <form onSubmit={this.handleSubmit}> 
       <TextInput 
        uniqueName="email" 
        name="email"  
        text="Email Address" 
        required={true}  
        minCharacters={6} 
        validate="email" 
        errorMessage="Email is invalid" 
        emptyMessage="Email is required" 
       /> 

       <TextInput 
        text="User" 
        name="User src" 
        required={true} 
        minCharacters={3} 
        validate="notEmpty" 
        errorMessage="Name is invalid" 
        emptyMessage="Name is required" 
       /> 

       <button type="submit">Submit</button> 
      </form> 
     ); 
    } 
} 

export default RequestForm; 

Answer 1

Sorun, render yönteminizle ilgilidir. onSubmit etkinliğinizin kendi içeriği vardır, bu yüzden this.handleSubmit yaptığınızda, yanlış bağlamı handleSubmit'a geçireceksiniz. this'u bağlamanız yeterlidir!

<form onSubmit={this.handleSubmit.bind(this)}> 

Veya teklif edilen bağlama operatörüyle

: [ES6 çalışmıyoruz ref ve setstate Tepki] arasında

<form onSubmit={::this.handleSubmit}>