React JS Specify Multiple Conditions if/esle Statement

Oct 19, 2022 . Admin

Hello Friends,

This is a short guide on react js specify multiple conditions if/else statement. step by step explain and specify multiple conditions if/else statement react js. This article goes in detailed on multiple conditions if/else react js. you will learn multiple conditions if/else in react js.

In this example specify multiple conditions if/else statement in react js. I will simply explain in use of multiple if/else statement in react js. So, let's start with the following example.

Step 1: Create React JS App

In this step, open your terminal and execute the following command on your terminal to create a new react app:

npx create-react-app reactjs-my-example
Step 2: Create index.js file src/index.js
import React from 'react';
import ReactDOM from 'react-dom/client';
  
function ConditionalRender(){

    let n = 5
    let txt = 'hello'
    
    let c = [
        n === 5, 
        n === 4, 
        n === 6,
        txt === 'hello', 
        txt === 'bye'
    ];
    
    if(c[0] || c[1] || c[2] || c[3] || c[4]){
        document.write('It satisfies ONE or MORE conditions.');
    }else{
        document.write('NO conditions have been satisfied.');
    }
    
};

const root = ReactDOM.createRoot(document.getElementById('root'));

root.render(<ConditionalRender />);   
Run React JS App:
npm start

Output:

It satisfies ONE or MORE conditions.

I hope it can help you...

#React JS