티스토리 뷰
컴포넌트가 2개인 경우 삼항연산자를 이용하면 되지만
그보다 많을 경우에는 삼항연산자 대신 아래처럼 사용하면 된다
<div>
{
{
1: <ComponentA />,
2: <ComponentB />,
3: <ComponentC />
}[id]
}
</div>
오브젝트 부분을 변수로 만들어서 사용해도 됨
const object = {
1: <ComponentA />,
2: <ComponentB />,
3: <ComponentC />
}
<div>
{object[id]}
</div>
참고사이트
'라이브러리, 프레임워크 > React' 카테고리의 다른 글
| [React + NestJS] 카카오 로그인 + JWT 구현 코드 예시, 에러 뜰 경우 (0) | 2023.03.12 |
|---|---|
| [React] 반응형 웹을 위한 미디어쿼리 작성 예시 (0) | 2023.01.31 |
| [React] Boolean state if문 없이 toggle 구현 예시 (0) | 2023.01.12 |
| [React] 모달창 띄운 상태에서 스크롤 막는 코드 예시 (0) | 2023.01.10 |
| [React] 여러 개 이미지를 한 번에 import하기 (0) | 2023.01.08 |
댓글