SHARE
TWEET

Untitled

a guest Sep 16th, 2019 92 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React from "react";
  2. import ReactDOM from "react-dom";
  3. import "./styles.css";
  4.  
  5. const thisInput = React.createRef();
  6.  
  7. class App extends React.Component {
  8.   constructor(props) {
  9.     super(props);
  10.     this.state = {
  11.       inputVal: ""
  12.     };
  13.   }
  14.  
  15.   componentDidMount() {
  16.     thisInput.current.focus();
  17.   }
  18.  
  19.   onChangeInput() {
  20.     this.setState({
  21.       inputVal: thisInput.current.value
  22.     });
  23.   }
  24.  
  25.   render() {
  26.     return (
  27.       <div className="App">
  28.         <h1>Ref Focus Input On Load</h1>
  29.         <input
  30.           type="text"
  31.           ref={thisInput}
  32.           onChange={e => this.onChangeInput(e)}
  33.         />
  34.         <p>Result : {this.state.inputVal}</p>
  35.       </div>
  36.     );
  37.   }
  38. }
  39.  
  40. const rootElement = document.getElementById("root");
  41. ReactDOM.render(<App />, rootElement);
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!
 
Top