React: Event handler method for Backspace

后端 未结 2 1914
隐瞒了意图╮
隐瞒了意图╮ 2021-02-19 06:39

I am trying to handle an event when the user presses the Backspace button.

I saw this, and I guess I can find Backspace key code using

console.log(\"Did y

2条回答
  •  南旧
    南旧 (楼主)
    2021-02-19 07:11

    Depending on your implementation you should use onKeyUp which should ensure the value of the input has been modified before the event is fired.

    Based on the above answer

    var InputDemo = React.createClass({
    
        getInitialState: function() {
        return {
            message: ''
        };
      },
      onKeyUp: function(e) {
        // This would have the current value after hitting backspace.
        if (e.keyCode === 8) { 
         console.log('delete');
         console.log(`Value after clearing input: "${e.target.value}"`)
         // Value after clearing input: ""
        }
      },
      onKeyDown: function(e) {
        // This would have the value set regardless of hitting backspace "test"
        if (e.keyCode === 8) { 
         console.log('delete');
         console.log(`Value after clearing input: "${e.target.value}"`)
         // Value after clearing input: "Test"
        }
      },
      handleChange: function(e) {
        this.setState({
            message: e.target.value
        });
      },
      render: function() {
        return (
           
    ); } });

提交回复
热议问题