[typescript error] Type '{ children: Element; }' has no properties in common with type 'IntrinsicAttributes'

Type '{ children: Element; }' has no properties in common with type 'IntrinsicAttributes'.ts(2559)

>>'{children:Element; }' 형식에는 'IntrinsicAttributes(고유특성)'.ts(2559) 유형과 공통되는 속성이 없습니다.

 

 

뭔말인지는 잘모르는데 대충 췰드런 자리에 뭐 넣었으니까 타입을 집어넣어라? 겟지 ?

하고 메인에 FC 를 넣어야 되나 VFC 를 넣어야 되나 어디서 본거 같애서 넣어봤다. 그런데 안되네 ??

 

생각해보니가 넣어도 Main 에 췰드런을 쓴게 아니라 Header 라는 컴포넌트에 넣어줘야되서 그렇게 Header FC 를 추가해 주니까 해결 되었다.

 

근데 FC 랑 VFC 는 뭐하는 거고 다른점이 뭘까?

 

type FC<P = {}> = FunctionComponent<P>

interface FunctionComponent<P = {}> {

(props: PropsWithChildren<P>, context?: any): ReactElement<any, any> | null;

propTypes?: WeakValidationMap<P>;

contextTypes?: ValidationMap<any>;

defaultProps?: Partial<P>;

displayName?: string;

}

 

type PropsWithChildren<P> = P & { children?: ReactNode };

type VFC<P = {}> = VoidFunctionComponent<P>

interface VoidFunctionComponent<P = {}> {

(props: P, context?: any): ReactElement<any, any> | null;

propTypes?: WeakValidationMap<P>;

contextTypes?: ValidationMap<any>;

defaultProps?: Partial<P>;

displayName?: string;

}

 

FC의경우 일단 다른점은 children 이 옵션널로 정해져 있다.

근데 컴포넌트마다 children 이 필수적인 경우에는 VFC 를 쓰고 children 을 명시를 해서 타입을 정해주는 식이다.(그냥 FC 로해도 오류는 안난다.) 다만 타입체크가 안될뿐?