위의 글에서 만든 private route에서 props가 있는 컴포넌트를 감싸면 어떻게 될까? 바로 에러가 발생한다.
말 그대로 param를 받도록 타입이 잡혀있지 않기 때문이다. 타입이 잡혀있지 않다?
바로 이부분이다. 타입 지정에 문제가 없는 것 같아보이지만, HOC에서 반환하는 경우 기본적으로 props가 있을 수도 없을 수도 있는데 이 React.FC라는 타입은 기본적으로 children props를 포함하고 있다. 는 점을 알아야 한다. HOC의 반환값을 React.FC로 지정하면 props가 없는 컴포넌트를 감쌀경우 에러가 발생하여 호환성 문제가 발생하게 되기 때문에 이 HOC의 반환값인 ComponentType으로 감싸주는 컴포넌트의 타입을 수정해주어야 한다.
먼저 감싸주는 타입을 명확하게 React.ComponentType으로 지정해주고 제네릭타입을 통해 받아오는 타입을 그대로 사용할 수 있도록 해주자.
그리고 감싸주는 컴포넌트의 타입도 React.FC에서 React.ComponentType으로 변경해주자.
