• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

9강 && 논리연산자 질문입니다.

24.03.12 13:55 작성 조회수 94

2

소플님, 강의 정말 잘 듣고 있습니다.

감사합니다~

 

소플님 질문 있습니다.

 

9-1강에서 && 논리 연산자 설명에서

 

count = 0 인 경우.

 

return (

count && <p>잘 듣고 있습니다~ {count} 번</p>

);

 

상기 결과는

 

0으로 출력 된다고 설명 들었는데요.

 

9-1 강의에서

isLoggedIn 값이 false로 넘겨졌을 때에

 

return (

isLoggedIn && 환영합니다.

<button>로그인</button>

);

인 경우의 결과는


false

<button>로그인</button>

 

이렇게 false가 찍혀야 할것 같은데 소플님의 영상 화면에서는 버튼 밖에 안보입니다.

왜 그런 걸까요?

답변 2

·

답변을 작성해보세요.

1

소플님 답변 감사합니다~

그리고 추가 팁 설명도 감사합니다~~

기분 좋은 하루 되세요!

1

안녕하세요, 소플입니다.

 

리액트에서 boolean 타입인 false, 그리고 null 값은 화면에 출력되지 않습니다.

하지만 0의 경우에는 그 값이 화면에 출력되기 때문에 유의하시라고 강의에서 언급한 것입니다.

 

그래서 조건부 렌더링을 할 때 조건문의 값이 0이 될 수 있는 경우에는,

아래와 같이 !!를 사용해서 강제로 boolean으로 변환하는 형태를 사용하시는 것이 좋습니다 😀

{!!value && <div>Hello, world!</div>

 

감사합니다.