컴포넌트를 props로 전달하기

1. 컴포넌트를 props로 children 말고 추가로 넘겨주고 싶어서
   다음과 같이 render 함수 형태로 전달

const Child = (props) => {
	return (
    	<>
        	<div>{props.render}</div>
			<div>{props.children}</div>
        </>
    )
}

const Parent = () => {
	return (
    	<Child render={() => <div>Render Component</div>}>
        	<div>Children Component</div>
        </Child>
    )
}

2. 에러발생

Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.

3. 수정
   render 함수를 render()로 실행했더니 에러가 사라졌다!

const Child = (props) => {
	return (
    	<>
        	<div>{props.render()}</div>
			<div>{props.children}</div>
        </>
    )
}

const Parent = () => {
	return (
    	<Child render={() => <div>Render</div>}>
        	<div>Children</div>
        </Child>
    )
}