11. Conditional Rendering

1. Conditional Rendering

조건부 렌더링

어떠한 조건에 따라서 렌더링이 달라지는 것

2. 자바스크립트의 truthy /falsy

종류

3. Element Variables

엘리먼트 변수

리액트의 엘리먼트를 변수처럼 다루는 방법

예시

4. Inline Condition

별도로 코드를 분리된 곳에 작성하지 않고 조건문을 코드 안에 집어넣는 것

가. Inline If

If를 필요한 곳에 집어넣어 작성하는 방법
&& 연산자를 이용함

단축평가

JSX코드 안에서 중괄호를 이용해 직접 사용

나. Inline If-else

조건문에 값에 따라서 다른 엘리먼트를 보여줄때

삼항연산자

예시

5. 컴포넌트를 렌더링 하고 싶지 않을 때?

null을 리턴하면 됨