Hello Devs,

In this tutorial, we are going to learn about react map example.

Given below are few examples for react map example.




Example 1:

src/App.js

import React from 'react';
   
function App() {
   
  const myArray = ['Hardik', 'Paresh', 'Rakesh', 'Mahesh', 'Kiran'];
  
  return (
    <div className="container">
        <h1>React Map Loop Example - Rathorji.in</h1>
   
        {myArray.map(name => (
          <li>
            {name}
          </li>
        ))}
   
    </div>
  );
}
   
export default App;



Example 2:

src/App.js

import React from 'react';
  
function App() {
  
 const students = [
              {
                'id': 1, 
                'name': 'Ratorji', 
                'email': 'rathorji@gmail.com'
              },
              {
                'id': 2, 
                'name': 'Paresh', 
                'email': 'paresh@gmail.com'
              },
              {
                'id': 2, 
                'name': 'Karan', 
                'email': 'karan@gmail.com'
              },
          ];
  
  return (
    <div className="container">
        <h1>React Map Loop Example - Rathorji.in</h1>
   
        <table className="table table-bordered">
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Email</th>
            </tr>
  
            {students.map((student, index) => (
              <tr data-index={index}>
                <td>{student.id}</td>
                <td>{student.name}</td>
                <td>{student.email}</td>
              </tr>
            ))}
  
        </table>
  
    </div>
  );
}
  
export default App;


I hope this example helps you.