Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Вивчайте Завдання: Відображення Колекцій Даних | Багаторазові Компоненти та Потік Даних
Вступ до React

bookЗавдання: Відображення Колекцій Даних

Завдання: Відобразити список товарів

Обробіть дані, отримані з бекенду, та забезпечте їх коректне відображення у форматі списку.

Завдання:

  • Використати метод map() для відображення масиву товарів.
  • Обов'язково заповнити необхідні поля:
  1. h2 має містити назву товару (name);
  2. p має містити опис товару (description);
  3. span має містити рядок "Price:" та ціну товару (price).
  1. Використайте метод map() для ітерації по масиву props.goods.
  2. Встановіть властивість key елемента <li> унікальним значенням, наприклад, властивістю id елемента.
  3. Усередині кожного елемента <li> використайте такі елементи:
    • Елемент <h2> для відображення назви товару. Отримайте назву з поточного item;
    • Елемент <p> для відображення опису товару. Отримайте опис з поточного item;
    • Елемент <span> для відображення рядка "Price:" та ціни товару. Отримайте ціну з поточного item.

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 2. Розділ 7

Запитати АІ

expand

Запитати АІ

ChatGPT

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

bookЗавдання: Відображення Колекцій Даних

Свайпніть щоб показати меню

Завдання: Відобразити список товарів

Обробіть дані, отримані з бекенду, та забезпечте їх коректне відображення у форматі списку.

Завдання:

  • Використати метод map() для відображення масиву товарів.
  • Обов'язково заповнити необхідні поля:
  1. h2 має містити назву товару (name);
  2. p має містити опис товару (description);
  3. span має містити рядок "Price:" та ціну товару (price).
  1. Використайте метод map() для ітерації по масиву props.goods.
  2. Встановіть властивість key елемента <li> унікальним значенням, наприклад, властивістю id елемента.
  3. Усередині кожного елемента <li> використайте такі елементи:
    • Елемент <h2> для відображення назви товару. Отримайте назву з поточного item;
    • Елемент <p> для відображення опису товару. Отримайте опис з поточного item;
    • Елемент <span> для відображення рядка "Price:" та ціни товару. Отримайте ціну з поточного item.

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 2. Розділ 7
some-alt