조건부 렌덩링 질문드립니다.

[이동주]

강의 내용중에서 삼항연산자를 활용한 조건부 렌더링은 잘 사용하고 있습니다.
하지만 만약에 조건이 한개가 아닌 두개 이상일 때는 어떻게 조건부 렌더링을 하나요?
제가 생각한것은 괄호를 세개 사용하고 && 연산자를 활용하여
state가 1부터 3까지 세가지 상태가 있다고 가정할 때
{
state === 1 && <State1 />
}
{
state === 2 && <State2 />
}
{
state === 3 && <State3 />
}
이런식으로 생각했는데 더 좋은 방법이 있을까요?

[codingapple]

컴포넌트들을 array에 다 집어넣어두고 array[state+1] 이러면 될듯요

[이동주]

state의 상태가 만약 1,2,3이 아니라 "tiger", "dog", "cat"등과 같은 문자열로 구분이 된다면 어떻게 해야할까요?
"tiger"이면 0번을 부여하고 "dog"이면 1번, "cat"이면 2번을 부여하는 useState를 만들고
알려주신 방법대로 array[state]하면 될까요?
상태가 "tiger"이면 서버로부터 호랑이에 관한 정보를 불러와 렌더링해주고 상태가 "dog"이면 개정보,
"cat"이면 고양이정보를 불러와 렌더링 해주는 페이지를 만들고 싶습니다.

[codingapple]

object에 { tiger : <컴포넌트> } 저장해두고 object[state] 해도 될듯요

[글쓴이]

글