useRef

Develop/React.js

[React] useRef

useRef ๋ž€ useRef๋Š” React์—์„œ ์ œ๊ณตํ•˜๋Š” Hook ํ•จ์ˆ˜ ์ค‘ ํ•˜๋‚˜๋กœ, ์ผ๋ฐ˜์ ์œผ๋กœ DOM ์š”์†Œ๋ฅผ ์„ ํƒํ•˜๊ฑฐ๋‚˜ ์ปดํฌ๋„ŒํŠธ์—์„œ ๋ณ€๊ฒฝ ๊ฐ€๋Šฅํ•œ ๊ฐ’์„ ์ €์žฅํ•˜๋Š” ๋ฐ ์‚ฌ์šฉ๋œ๋‹ค. ์˜ˆ์‹œ ์˜ˆ๋ฅผ ๋“ค์–ด, useRef๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ DOM ์š”์†Œ๋ฅผ ์„ ํƒํ•˜๋Š” ๊ฒฝ์šฐ ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ๋‹ค. import React, { useRef, useEffect } from 'react'; function Example() { const inputRef = useRef(null); useEffect(() => { inputRef.current.focus(); }, []); return ; } ์œ„์˜ ์ฝ”๋“œ์—์„œ useRef๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ input ์š”์†Œ๋ฅผ ์„ ํƒํ•˜๊ณ , useEffect๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ปดํฌ๋„ŒํŠธ๊ฐ€ ๋งˆ์šดํŠธ๋  ๋•Œ input ์š”์†Œ์— ์ž๋™..

wonny_dev
'useRef' ํƒœ๊ทธ์˜ ๊ธ€ ๋ชฉ๋ก

...