CODE EXAMPLE FOR JAVASCRIPT

react class component input text with clear button

class App extends React.Component {
  constructor(props) {
    super(props);
    
    this.state = {
      data: ''
    }
    this.updateState = this.updateState.bind(this);
    this.clearData = this.clearData.bind(this);
    };
  updateState(e) {
    this.setState({data: e.target.value});
  }
  clearData() {
    this.setState({data: ''});
    ReactDOM.findDOMNode(this.refs.myInput).focus();
  }
  render() {
    return (
    <>
        <input type="text" value = {this.state.data} onChange = {this.updateState} ref = "myInput"/>
        <button onClick={this.clearData}>CLEAR</button>
        <h4>{this.state.data}</h4>
        </>
             );
  }
}
        ReactDOM.render(
        <App />, document.getElementById('mountNode') );