React Switch Case Statement

Hello Devs,

In this tutorial, we are going to learn switch case statement in react js.

Given below are few examples for switch case statement in react js.

Example 1:

src/App.js

import React from 'react';
  
function App() {
  const userType = 'Admin';
  
  return (
    <div className="container">
        <h1>React Switch Case Condition Example - Rathorji.in</h1>
  
        {(() => {
  
           switch (userType) {
              case 'Admin':
                  return (
                    <div>You are a Admin.</div>
                  )
              case 'Manager':
                  return (
                    <div>You are a Manager.</div>
                  )
              default:
                  return (
                    <div>You are a User.</div>
                  )
           }
  
        })()}
  
    </div>
  );
}
   
export default App;

Output:

Example 2:

src/App.js

import React from 'react';
  
function App() {
   
 function SwitchCase(props) {
    switch(props.value) {
      case 'Admin':
        return 'You are a Admin.';
      case 'Manager':
        return 'You are a Manager.';
      default:
        return 'You are a User';
    }
  }
  
  return (
    <div className="container">
        <h1>React Switch Case Condition Example - Rathorji.in</h1>
  
        <SwitchCase value={'Admin'} />
  
    </div>
  );
}
    
export default App;

Output:

I hope this example helps you.