[React] 조건부 렌더링 2

리액트 조건부 렌더링 간단한 예시와 설명

이전에 삼항 연산자처럼 작동하는 조건부 렌더링에 대해 적어보았음

간단하게 정리하자면 값이 true인지 false인지 여부에 따라 렌더링을 다르게 했음

이러한 조건부 렌더링은 로그인인지 아닌지에 따라 로그인, 로그아웃 버튼을 보여주고 싶은 경우 사용 가능함

그렇다면 조건이 참일때만 작동하고 false인 경우 렌더링하고 싶은 내용이 없다면? 

 

예시

import React from 'react';

function App() {
  // 생략...
 
  return (
    <div>
      {type === 2 && (
        <p>Welcome</p>
      )
    </div>
  );
}

어떤 타입이 있어서 type이 2인 경우에만 Welcome을 렌더링 하고 싶은 경우 && 으로 작성해주면 됨