[웹뷰] 인풋 포커스 해제 시 화면 고정 버그 해결

웹뷰에서 인풋의 키패드를 띄운 상태로 스크롤하다가 다른 영역을 터치 하면 그대로 화면이 고정되어버리는 현상이 발견된다..

 

const useBlurActiveElement = (): TouchEventHandler<any> => {
  const handler = useCallback((): void => {
    if (isServerSide()) return
    ;(document.activeElement as HTMLInputElement)?.blur?.()
  }, [isServerSide])

  return handler
}

export default useBlurActiveElement

훅으로 만들어서 아래처럼 필요한 컴포넌트에 주입해서 임시적으로 해결.

 const blurActiveElement = useBlurActiveElement()


<Container onTouchStart={blurActiveElement}>
...
</Contaner>