props.children 을 사용하기 위해, 컴포넌트 함수에 React.FC 타입을 지정하면, 자동으로, children 이 나온다고 한다.
하지만 나는 React18 버젼을 쓰고있다.
https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-typescript-definitions
네, 암묵적인 children 선언이 사라졌습니다.
그래서 이제는 children 을 선언할때, React.ReactNode 타입으로 선언해야합니다.
props.children 사용하기
const Component: React.FC<{ children?: React.ReactNode }> = (props) => {
const { children } = props;
props.children 을 이용하여, Layout 만들기
const Layout: React.FC<{ children?: React.ReactNode }> = (props) => {
const { children } = props;
return (
<div>
<h1> 이게 레이아웃? </h1>
{children}
<h1> 이게 푸터? </h1>
</div>
);
};
export default Layout;
'React > React-TypeScript' 카테고리의 다른 글
7. React와 함께 TypeScript 사용하기(6), [ Context ] (0) | 2022.12.26 |
---|---|
6. React와 함께 TypeScript 사용하기(5), [ State ] (1) | 2022.12.26 |
4. React와 함께 TypeScript 사용하기(3), [ 상향식 State 이동 (함수) 사용하기, props 와 함수 ] (0) | 2022.12.24 |
3. React와 함께 TypeScript 사용하기(2), [ useRef 와 양식 제출, event ] (0) | 2022.12.24 |
2. React와 함께 TypeScript 사용하기(1), [ props 와 React.FC , 타입 아웃소싱, Type Aliases ] (0) | 2022.12.23 |
댓글