Завдання: Відображення Колекцій Даних у React
Завдання: Відобразити список товарів
Обробіть дані, отримані з бекенду, та забезпечте їх коректне відображення у форматі списку.
Завдання:
- Використати метод
map()для рендерингу масиву товарів. - Обов'язково заповнити необхідні поля:
h2має містити назву товару (name);pмає містити опис товару (description);spanмає містити рядок "Price:" та ціну товару (price).
- Використайте метод
map()для ітерації по масивуprops.goods. - Обов'язково встановіть проп
keyелемента<li>унікальним значенням, наприклад, властивістю id елемента. - Усередині кожного елемента
<li>використовуйте такі елементи:- Елемент
<h2>для відображення назви товару. Доступ до назви через поточнийitem; - Елемент
<p>для відображення опису товару. Доступ до опису через поточнийitem; - Елемент
<span>для відображення рядка "Price:" та ціни товару. Доступ до ціни через поточнийitem.
- Елемент
Все було зрозуміло?
Дякуємо за ваш відгук!
Секція 1. Розділ 15
Запитати АІ
Запитати АІ
Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат
Suggested prompts:
Can you explain how to use the map() method in this context?
What should I do if some goods are missing a description or price?
Can you show an example of how the rendered list should look?
Awesome!
Completion rate improved to 2.17
Завдання: Відображення Колекцій Даних у React
Свайпніть щоб показати меню
Завдання: Відобразити список товарів
Обробіть дані, отримані з бекенду, та забезпечте їх коректне відображення у форматі списку.
Завдання:
- Використати метод
map()для рендерингу масиву товарів. - Обов'язково заповнити необхідні поля:
h2має містити назву товару (name);pмає містити опис товару (description);spanмає містити рядок "Price:" та ціну товару (price).
- Використайте метод
map()для ітерації по масивуprops.goods. - Обов'язково встановіть проп
keyелемента<li>унікальним значенням, наприклад, властивістю id елемента. - Усередині кожного елемента
<li>використовуйте такі елементи:- Елемент
<h2>для відображення назви товару. Доступ до назви через поточнийitem; - Елемент
<p>для відображення опису товару. Доступ до опису через поточнийitem; - Елемент
<span>для відображення рядка "Price:" та ціни товару. Доступ до ціни через поточнийitem.
- Елемент
Все було зрозуміло?
Дякуємо за ваш відгук!
Секція 1. Розділ 15