인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

NUTEE님의 프로필 이미지
NUTEE

작성한 질문수

React로 NodeBird SNS 만들기

3-6. react-redux 훅 사용하기

<3-6> 의 조건부 렌더링 질문입니다.

해결된 질문

작성

·

187

0

거의 끝부분에 삼항연산자를 통해서 조건부렌더링을 할때 

{ user ? <div> {user.nickname}님이 접속중입니다.</div> : <div>로그아웃 했습니다.</div>}

이렇게 하면

로그아웃 상태일때, 

님이 접속중입니다. 라고 뜨고 false 상태로 넘어가지를 못하더라구요.

그래서 user 대신에 isLoggedIn을 사용해서

{ isLoggedIn ? <div> {user.nickname}님이 접속중입니다.</div> : <div>로그아웃 했습니다.</div>}

이렇게 해결을 하기는 했는데 왜 이런 현상이 발생하는거죠?

 

답변 2

0

user reducer에 스위치부분을 이렇게해보세요    case LOG_OUT:

      return { ...stateisLoggedIn: falseuser: null };

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

user가 빈 객체인 경우 {} ? true : false가 되는데 {}는 항상 true입니다. 아마 이렇게 빈 객체가 오지 않았나 생각이 드네요. isLoggedIn이 명확하게 true와 false이기 때문에 좋은 방법이긴 합니다.

NUTEE님의 프로필 이미지
NUTEE

작성한 질문수

질문하기