2015-10-11 2 views
1

Я хочу обработать keyPressDown (введите) на поле ввода, функция kinda работает, но я больше ничего не могу напечатать.ReactJS Keydown on Input

handleSubmit: function (e) { 
    e.preventDefault(); 
    if (e.keyCode === 13) { console.log('hit enter'); } 
    else { return false; } 
    }, 
render: function(){ 
    return (
    <div className="addTask"> 
    <form className="questionsTask" autoComplete="off"> 
    <ol className="questions"> 
    <li> 
    <input id="taskName" name="taskName" type="text" placeholder="What's your next task?" onChange={this.handleTask.name} onKeyDown={this.handleSubmit}/> 
    </li> .... 

ответ

2

Вам необходимо обработать onChange. Сделайте что-то вроде:

var TextInput = React.createClass({ 
    getInitialState: function() { 
     return {text: ''}; 
    }, 
    inputSubmit: function() { 
     console.log(this.refs.userInput.getDOMNode().value); 
     this.setState({text: ''}); 
    }, 
    handleChange: function(e) { 
     this.setState({text: e.target.value}); 
    }, 
    handleKeyDown: function(e) { 
     if (e.keyCode === 13) { 
      return this.inputSubmit(); 
     } 
    }, 
    render: function() { 
     return (<input value={this.state.text} ref="userInput" onChange={this.handleChange} onKeyDown={this.handleKeyDown}/>); 
    } 
}); 

через @spicyj (http://jsfiddle.net/spicyj/HdR6E/)