prop Drilling을 막기 위해 최상위 검색 상태값 useState대신 useRef 사용

[DPS0340]

문제 정의

상위 컴포넌트의 상태값을 바로 넘겨버리기 때문에 search, setSearch 값이 변할 때마다 재렌더링이 일어남.
이 현상은 지역 변수의 경우에도 똑같지만, SearchField 컴포넌트를 포함하고 있는 Header 컴포넌트 자체가 재렌더링되기 때문에 autofocus등 입력 기능이 잘 되지 않는 문제가 발생함.

해결 방법

useRef의 반환값인 ref 객체는 값이 변해도 재렌더링이 되지 않으므로 적절하다고 생각되었음. (object는 reference type이므로)
간단하게 useState 대신 useRef를 통해 현재값을 갱신시킴.
추후 값 사용이 필요할 경우 searchRef.current를 사용하면 될 듯함.