마우스 따라 가기

박찬영·2023년 2월 14일
0

마우스가 움직일 때 작동하는 함수 : onPointerMove
마우스의 좌표값 : clientX, clientY

연관있는 state값들은 객체형식으로 관리

const [position, setPosition] = useState({ x: 0, y: 0 });

onPointerMove={(e) => {
	setPosition({ x: e.clientX, y: e.clientY });
}}

객체 형식의 state에서 특정 값만 수정하려면?

const [position, setPosition] = useState({ x: 0, y: 0, z: 0 });
setPosition((prev)=>({x:e.clientX, y:prev.y, z:prev.z}))
또는
setPosition((prev)=>({...prev, x:e.clientX}))

0개의 댓글