Display the objects inside an array in ReactJS

Question

let favorites=[];
var myObj = {
      "username" : username,   
      "problems" : solved  
  };
  //push the object to your array
  favorites.push( myObj );

I am pushing the response from an Axios API into an array. How to display the information in ReactJS in the form of table.

Answer 1

Simple map function returning each row of the body:

<table>
    <thead>
        <tr>
            <th>Username</th>
            <th> Problems</th>
        </tr>
    </thead>
    <tbody>
        {favourites.map((fav) => {
            return (
                <tr>
                    <td>{fav.username}</td>
                    <td>{fav.problems}</td>
                </tr>
            );
        })}
    </tbody>
</table>;