useRef를 사용해서 window resize hook을 만들었는데 잘 동작하지 않습니다.

안녕하세요:) window resize 이벤트가 발생했을 때 ref 값은 바뀌지만 컴포넌트는 렌더링되지 않아서 발생하는 이슈 같습니다. useRef대신 useState를 사용해서 값을 저장하면 해결될 것 같습니다! useRef에 대해서 부가적으로 설명드리면, ref는 DOM의 값을 레퍼런스하고 있는 객체이며 React 라이프사이클과 독립적으로 유지되는 값입니다. 따라서 ref.current의 값이 바뀌더라도 React 컴포넌트를 렌더링하지 않습니다. 이러한 특성을 이용해서 리렌더를 발생시키지 않고 DOM의 값을 변경하거나 참고하고 싶을 때 사용합니다.

흠, 글쎄요. 호출 순서의 문제같네요. useIsMobile()을 호출한 시점에, resize 이벤트 핸들러를 걸었고, (그리고, 핸들러를 제거하는 코드도 있고), 마지막으로, current값의 크기에 따라 참/거짓값을 반환했는데요, 이미 이 시점에 참/거짓 값은 정해진 상태이고, 사후에 resize이벤트 핸들러 콜백에 의해, current값이 바뀌었겠네요. current값이 이때 바뀐다고 해도, 참/거짓이 반환된 값은 재계산하지 않는 상태로 보입니다. 이미 성원님이 답변해주신대로, useState로 처리했다면, 상태값이 바뀌면, 다시 계산을 하므로 원하는 계산 값을 구할 수도 있을 것 같습니다. 그런데, 평범한 자바스크립트 코드로 할 일 같은데요, 꼭 리액트 컴포넌트로 해결하셔야 하는 상황일까요?