Массив для создания дочерних компонентов в React
Пусть у нас есть массив с продуктами:
const prods = [
{id: id(), name: 'product1', cost: 100},
{id: id(), name: 'product2', cost: 200},
{id: id(), name: 'product3', cost: 300},
];
Давайте выведем на экран три компонента Product,
передав им в пропсы данные из нашего массива.
Пока не будем использовать цикл, а просто
будем обращаться к элементам массива и объекта:
function App() {
return <div>
<Product name={prods[0].name} cost={prods[0].cost} />
<Product name={prods[1].name} cost={prods[1].cost} />
<Product name={prods[2].name} cost={prods[2].cost} />
</div>;
}
Сделайте компонент User, выводящий
данные юзера на экран. Пусть этими данными
будут имя, фамилия, возраст. Оформите данные
юзера в виде тега tr, содержащего
три тега td.
В компоненте App дан следующий массив:
const users = [
{id: id(), name: 'user1', surn: 'surn1', age: 30},
{id: id(), name: 'user2', surn: 'surn2', age: 31},
{id: id(), name: 'user3', surn: 'surn3', age: 32},
];
С помощью этого массива выведите трех юзеров.
Оформите их вывод в виде таблицы table.