How to render an Array in React
January 28, 2020
Let's say you have an array like this:
const cars = ["BMW", "Mercedes", "Audi", "Volkswagen", "Ferrari"];
Let's say you want to render those names in a list.
A typical solution to this problem would look like this:
const cars = ["BMW", "Mercedes", "Audi", "Volkswagen", "Ferrari"];
function App() {
return (
<ul>
{cars.map((car) => (
<li key={car}>Car: {car}</li>
))}
</ul>
);
}
You just have to remember that you need to provide a unique key to each child.
For more information check out the React Documentation on this specific issue.