240807 TIL_검색

1. 검색

디바운스를 쓰기 위해 useEffect로 감쌌더니 의존성 배열에 함수도 추가하라고 밑줄이 나왔다.

추가함.

추가했더니 갑자기 그 함수를 useCallback을 쓰란다.

썼다.

그랬더니 useCallback 의존성 배열로 3개 추가하란다.

추가했다.

뭐지.....

샤드시엔 UI 쓰면서 검색어 빈배열 -> null 로 바꾸기

트러블 슈팅
뭔가 이거저거 만지다 보니 이상한 문제 발생

검색어를 치면 => 안 나왔다가 => 갑자기 지우고 나면 나타남

이유?

코드에서 문제의 원인은 debounceSearchTerm 상태가 업데이트되는 타이밍과 관련이 있습니다. 현재 코드는 debounceSearchTerm이 업데이트된 후에 검색을 실행하도록 되어 있지만, 검색어 입력이 빠르게 이루어지면 debounce가 작동하면서 발생하는 딜레이로 인해 검색 결과가 늦게 나타날 수 있습니다. 또한 검색 결과가 이미 존재하는 경우에도 빈 문자열로 초기화되지 않기 때문에 백스페이스로 모든 문자를 지우고 나서야 결과가 나타나는 문제가 발생할 수 있습니다.

이 문제를 해결하기 위해 다음과 같은 개선사항을 적용할 수 있습니다:

debounceSearchTerm이 변경될 때마다 검색 결과를 초기화하는 로직 추가.
빈 문자열 입력 시 검색 결과를 초기화하는 로직 강화.

커피가 사람을 헤치는 게 느껴지는 게 커피 들이부었더니 마음대로 안 되니까 다리를 자꾸 떨고 싶다......