JAVASCRIPT

convert class based component into functional online

import React, { Component } from "react";
import { InputGroup, FormControl, Input } from "react-bootstrap";
class SimpleKeyEvent extends Component {
  constructor() {
    super();
    this.state = {
      name: "React-bootstrap key enter event"
    };
    this.onKeyUp = this.onKeyUp.bind(this);
  }
  onKeyUp(event) {
    if (event.charCode === 13) {
      this.setState({ inputValue: event.target.value });
    }
  }
  render() {
    const { inputValue } = this.state;
    return (
      <div>
        <InputGroup>
          <FormControl placeholder="First name" onKeyPress={this.onKeyUp} />
        </InputGroup>
        <hr />
        <span>Input value is : {inputValue}</span>
      </div>
    );
  }
}
export default SimpleKeyEvent;