Wie bekomme ich den Wert von Textbox in React?

Question

ich mit React.js gerade erst begonnen, und ich bin nur nicht sicher, ob es eine besondere Art und Weise ist es, den Wert einer Textbox zu erhalten, kehrte wie dies in einer Komponente:

var LoginUsername = React.createClass({ 
    render: function() { 
    return (
     <input type="text" autofocus="autofocus" onChange={this.handleChange} /> 
    ) 
    }, 
    handleChange: function (evt) { 
    this.setState({ value: evt.target.value.substr(0, 100) }); 
    } 
}); 

Answer 1

Wie in documentation Sie müssen verwenden gesteuerten Eingang erhalten. Um einen Eingang zu machen - gesteuert Sie benötigen zwei Stützen an, an sie

1. onChange - Funktion, die value Komponente state mit einem Eingang jedes Mal Eingang
2. value geändert wird eingestellt würde - Eingangswert von der Komponente state (this.state.value in Beispiel)

Exam ple:

getInitialState: function() { 
    return {value: 'Hello!'}; 
    }, 
    handleChange: function(event) { 
    this.setState({value: event.target.value}); 
    }, 
    render: function() { 
    return (
     <input 
     type="text" 
     value={this.state.value} 
     onChange={this.handleChange} 
     /> 
    ); 
    } 

Insbesondere über TextArea- - here

Answer 2

nur Ihre Eingabe aktualisieren, um der Wert

var LoginUsername = React.createClass({ 
    getInitialState:function(){ 
    return { 
     textVal:'' 
    } 
}, 
    render: function() { 
    return (
     <input type="text" value={this.state.textVal} autofocus="autofocus" onChange={this.handleChange} /> 
    ) 
    }, 
    handleChange: function (evt) { 
    this.setState({ textVal: evt.target.value.substr(0, 100) }); 
    } 
}); 

Ihr Texteingabewert ist immer in dem Zustand, und Sie können das gleiche von this.state.textVal