How to Use Array Map Function in React.js

Published on Aug 31, 2020

Map is a collection of elements where each element is stored as a key, value pair. Map object can hold both objects and primitive values as either key or value. It’s like PHP’s foreach loop.

Let’s try to render an array using map function in React app:

App.js
import React from 'react';

function App() {
  const array = ['1', '2', '3', '4', '5'];

  return(
    <ul>
      {array.map((value, index) => {
        return <li key={index}>{value}</li>
      })}
    </ul>
  )
}

export default App;
That’s it. Thanks for reading. ?

Comments (0)