How to render a list of items in React

Last updated on Oct 2, 2020 by Suraj Sharma

In this tutorial, you will learn to render or display a list of items in React.

Consider, we have a list of users as a local state(initialized using useState() hook) inside the function component ItemList

const userList = [
   id: 1,
   username: 'surajy2j',
   name: 'Suraj'
   id: 2,
   username: 'max20',
   name: 'Maxwell'

You can render the list of users as li elements using the method.

const ItemList = () => {
 const [users, setUsers] = React.useState(userList);
  return (
        <li key={}>

export default ItemsList;

Related Solutions

Rate this post

Suraj Sharma is a Full Stack Software Engineer. He holds a B.Tech degree in Computer Science & Engineering from NIT Rourkela.