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:

You are a Admin.



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:

You are a Admin.


I hope this example helps you.