[React] children

const Workspace: FC = ({children}) => {

	...
    
    return (
        <div>
            <button onClick={onLogout}>로그아웃</button>
            {children}
        </div>
    )
}

 

💡 {children}은 밑에처럼 Workspace 컴포넌트로 감싸면 그 안에 있는 내용들이 {children}이 된다

 

---

 

const Channel = () => {
    return (
        <Workspace>
            <div>children 안에 들어간다</div>;
        </Workspace>
    );
};

 

※ 리엑트에 있는 FC라는 타입 안에 children이 들어있다. 만약 children을 쓰지 않는 component가 있으면 VFC를 사용하면된다.