[8장] React.FC와 React.VFC

[dlantjdgkgk]

📝 p251

❓ React.FC와 React.VFC 타입은 어떻게 다르며, 어떤 것이 리액트 v18 이후 권장되는 방식인가요?

React.FC, React.VFC는 리액트 컴포넌트에서 JSX를 사용할 때 타입을 지정하기 위해 사용됩니다. 이 두 타입은 어떻게 다르며, 리액트 v18 이후 어떤 타입이 권장되는지 설명해주세요.

[jinsupark4255]

• React.FC는 암묵적으로 children을 포함하고 있기 때문에 해당 컴포넌트에서 children을 사용하지 않더라도 children props를 허용합니다. 따라서 children props가 필요하지 않은 컴포넌트에서는 더 정확한 타입 지정을 위해 React.FC 보다는 React.VFC를 사용합니다.

• 그러나 React.18 이후로 React.VFC가 삭제되었기 때문에 React.FC 또는 props 타입, 반환 타입을 직접 지정해야 합니다.

[YunjiNam]

React.FC 와 React.VFC 의 차이는 children 타입을 허용하는지 여부이다. React.FC 는 암묵적을 children 을 포함하고 있기 때문에 해당 컴포넌트에서 children 을 사용하지 않더라도 children props 를 허용한다. 그래서 children props 가 필요하지 않은 컴포넌트에서 더 정확하게 타입을 지정하기 위해 React.VFC 를 사용했었다. 하지만 v.18 로 넘어오면서 React.VFC 가 삭제되고 React.FC 에서 children 이 사라졌다. 그래서 children 을 사용하는 경우 타입을 따로 지정해줘야 한다.