-
[React.js] ๋ง์ฐ์ค ํธ๋ฒ ํจ๊ณผ๋ฅผ ์ ์ฉํ๊ธฐ ์ํ ์ปค์คํ
ํ
๋ง๋ค๊ธฐ (useHover.js)
๋ง์ฐ์ค ํธ๋ฒ ํจ๊ณผ๋ฅผ ์ ์ฉํ๊ธฐ ์ํ ์ปค์คํ
ํ
๋ง๋ค๊ธฐ (useHover.js) ๋ค์ด๊ฐ๋ฉฐ ์์ ์์ ๋ง์ฐ์ค ์ปค์๋ฅผ ํธ๋ฒ ์, ํจ๊ณผ๊ฐ ์๋ํ ์ ์๋๋ก ์ปค์คํ
ํ
์ ๋ง๋ค์ด๋ณด์. ๋ฐฉ๋ฒ ๊ธฐ์กด์ ๋ฐฉ๋ฒ ์ปค์คํ
ํ
์ ์ฌ์ฉํ์ง ์์ ๊ฒฝ์ฐ, @mouseover@, @mouseout@์ ๋ํ ๊ฐ๊ฐ์ ์ด๋ฒคํธ ํธ๋ค๋ฌ ํจ์๋ฅผ ๋ง๋ค์ด์ ๋ง์ฐ์ค ํธ๋ฒ ํจ๊ณผ๋ฅผ ์ ์ฉ์ํค๊ณ ์ถ์ ๋์์ ์ฐ๊ฒฐํด ์ฃผ๋ ๋ฐฉ์์ผ๋ก ๊ตฌํํ ์ ์์๋ค. import React, { useState } from react; const MyComponent = () => { const [isHovered, setIsHovered] = useState(false); const handleMouseOver = () => { setShowPopup(true); }; cons..
2024.02.20