[React][TypeScript] 'IntrinsicAttributes & IntrinsicClassAttributes 에러 해결방법

<Screen btnText="안녕하세요" />

에러 내용 

Type '{ btnText: string; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<App> & Readonly<{}>'.
  Property 'btnText' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<App> & Readonly<{}>'.

 

상황은 이렇다 컴포넌트에 props를 통해서 btnText를 보내려고 한다.

<GeetestScreen btnText="안녕하세요" />

받는쪽에서는 이런식으로 props를 받으려고 하는데

  constructor(props: any) {
    super(props);
    console.log("props", props);
  }

위와 같은 'IntrinsicAttributes & IntrinsicClassAttributes에러가 나왔는데 리액트에서 발생한 에러보다는 타입 스크립트에서 발생한 오류인 것처럼 보였다.

 

방법은 생각보다 간단하다

 

받는쪽에서 인터페이스를 작성해주면 된다. 

interface Iprops {
  btnText: string;
}

class App extends React.Component<Iprops> {

  constructor(props: any) {
    super(props);
    console.log("props", props);
  }

	...
}

 

타입을 지정하지 않아서 생기는 오류였는데 역시 타입스크립트는.... 이렇게 별거 아닌거 가지고 브레이크가 걸릴때가 있는 것 같다;;

잘해봐야지ㅠㅜ