☰

ReactJS で `onKeyPress` イベントを処理するにはどうすればいいですか? 質問する

tag-icon • tag-icon javascript reactjs keypress onkeypress
ReactJS で `onKeyPress` イベントを処理するにはどうすればいいですか? 質問する

ReactJS でイベントを動作させるにはどうすればよいですか?押されたonKeyPressときにアラートが表示されるはずです。enter (keyCode=13)

var Test = React.createClass({
    add: function(event){
        if(event.keyCode == 13){
            alert('Adding....');
        }
    },
    render: function(){
        return(
            <div>
                <input type="text" id="one" onKeyPress={this.add} />    
            </div>
        );
    }
});

React.render(<Test />, document.body);

ベストアンサー1

私は React 0.14.7 を使用しており、onKeyPress問題event.keyなく動作しています。

handleKeyPress = (event) => {
  if(event.key === 'Enter'){
    console.log('enter press here! ')
  }
}
render: function(){
     return(
         <div>
           <input type="text" id="one" onKeyPress={this.handleKeyPress} />
        </div>
     );
}

おすすめ記事