jsx switch

component를 분기 처리를 통해 렌더링 해보자 ! (switch 처럼)

<div>
      {
        {
          term: <Terms handlePage={handleStep} />,
          login: <Login handlePage={handleStep} />,
        }[step]
      }
</div>

아래와 같은 수행을 한다.

 

<div>
  {(() => {
      switch (step) {
        case 'term':
          return <Terms handlePage={handleStep} />;
        case 'login':
          return <Login handlePage={handleStep} />;
        default:
          return;
      }
  })()}

</div>

 

🎈 https://stackoverflow.com/questions/46592833/how-to-use-switch-statement-inside-a-react-component