계산된 속성명으로 조건부 랜더링

{id === '5' && <Debate />}
{id === '6' && <Writing />}
{id === '7' && <DebateDetail />}
{id === '8' && <Detail />}

계산된 속성명을 사용하여 id 값을 기반으로 컴포넌트에 동적으로 접근해보자 !

const pages = 
{5: <Debate />,
 6: <Writing />,
 7: <DebateDetail />,
 8: <Detail />,}


{pages[id]}