Ref hook in react

UseRef

/*
	A common use case is to access a child imperatively: 
*/

function TextInputWithFocusButton() {
  const inputEl = useRef(null);
  const onButtonClick = () => {
    // `current` points to the mounted text input element
    inputEl.current.focus();
  };
  return (
    <>
      <input ref={inputEl} type="text" />
      <button onClick={onButtonClick}>Focus the input</button>
    </>
  );
}

Source: reactjs.org

Ref hook in react

function TextInputWithFocusButton() {
  const inputEl = useRef(null);
  const onButtonClick = () => {
    // `current` points to the mounted text input element
    inputEl.current.focus();
  };
  return (
    <>
      <input ref={inputEl} type="text" />
      <button onClick={onButtonClick}>Focus the input</button>
    </>
  );
}

Source: reactjs.org

Similar codes

0 vote383 views1 answer
Top bar in react js
Javascript React
0 vote411 views1 answer
Bottom navigation bar react native hide on keyboard
Javascript React
0 vote401 views1 answer
Event handling in react documentation
Javascript React
2 votes393 views1 answer
How to do a classname variable and string react
Javascript React
0 vote572 views1 answer
React version on CMD
Javascript React
7 votes415 views3 answers
React route props
Javascript React
1 vote391 views1 answer
How to upload image in react js
Javascript React
0 vote361 views1 answer
React router history not defined
Javascript React
0 vote400 views1 answer
Show and Hide element in react
Javascript React
0 vote409 views1 answer
Reactjs clic copy
Javascript React