Languages
[Edit]
PL

React - jak ustawi─ç kurosr na elemencie input po renderowaniu

0 points
Created by:
Dirask JS Member
3460

W tym artykule chcieliby┼Ťmy pokaza─ç, jak w Reakcie┬áustawi─ç kursor┬ána elemencie┬áinput┬ábezpo┼Ťrednio po wyrenderowaniu komponentu.

W poniższym przykładzie używamy dwóch hooków:

  • useRef┬ákt├│ry przechowuje referencj─Ö┬ádo elementu┬áinput,
  • useEffect┬á - metoda┬á.focus()┬ájest┬áwywo┼éywana, gdy┬ákomponent┬áApp┬ázostanie wyrenderowany.

Uruchamialny przykład:

// ONLINE-RUNNER:browser;

// Uwaga: Odkomentuj poni┼╝sze linijki podczas pracy z kompilatorem JSX:
// import React from 'react';

const App = () => {
  const inputRef = React.useRef();
  React.useEffect(() => {
    if (inputRef.current) {
    	inputRef.current.focus();
    }
  }, []);
  return (
    <div>
      <label>Search: </label>
      <input ref={inputRef} />
    </div>
  );
}

const root = document.querySelector('#root');
ReactDOM.render(<App />, root );

ReactJS (PL)

React - jak ustawi─ç kurosr na elemencie input po renderowaniu
Native Advertising
­čÜÇ
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

ÔŁĄ´ŞĆ­čĺ╗ ­čÖé

Join