Passing id to a component in React

You already know that the component tag attributes go into props. This applies to all attributes except the key attribute, which is needed for use in loops, like this:

const items = prods.map(prod => {
	return <Product
		key ={prod.id}
		name={prod.name}
		cost={prod.cost}
	/>;
});

In this case, the name and cost attributes will be included in the props, but key will not be included. However, we may need to pass id to the component props. In this case, we will need to introduce one more attribute:

const items = prods.map(prod => {
	return <Product
		key ={prod.id}
		id  ={prod.id}
		name={prod.name}
		cost={prod.cost}
	/>;
});

Modify your User component so that it displays the id user in a paragraph.