이때도 clickHandler 속성에 빨간 밑줄이 생깁니다. 이 부분에 마우스를 올리면 오류 메시지가 표시됩니다.

그림 3-14 clickHandler 속성에 표시되는 오류 메시지
오류 메시지를 보면 Type ‘{ userObj: { name: string; age: number; }; clickHandler: () => void; }’ is not assignable to type ‘IntrinsicAttributes & { userObj: { name: string; age: number; }; }’.라고 나옵니다. 여기서 굵게 표시한 부분이 실제로 전달된 props 객체의 타입입니다. 이를 그대로 자식 컴포넌트의 매개변수 타입으로 지정하면 오류가 해결됩니다.