Карта через объект с дочерними объектами/массивом

Я пытаюсь сопоставить массив category (который находится внутри объекта List) и получить доступ id и name, которые находятся внутри массива объектов.

Ниже мои данные.

List = {
    category: [
      {
        id: 1,
        name: 'Alpha',
      },
      {
        id: 2,
        name: 'Bravo',
      },
      {
        id: 3,
        name: 'Charlie',
      },
    ],
  }

Ниже приведен код реакции, который пытается получить доступ к идентификатору и имени.

{List.category.map((index, res) => {
                console.info("Output:",res)
              })}

//Output: 0
//Output: 1
//Output: 2
//Output: 0
//Output: 1
//Output: 2
...

Как я могу получить доступ к name и id, которые находятся внутри category?

Пожалуйста, дайте мне знать ваши предложения.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
50
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Это сработает. (Хотя вам не следует использовать map, если вы не хотите отображать фактический вывод в пользовательском интерфейсе, но я предполагаю, что это просто отладочный код.)

{List.category.map(({ name, id }) => {
  console.info("Output:", name, id);
})}

Спасибо, и что мне делать, если я хочу отображать name и id внутри абзаца, например <p>{name}</p>

Jerémi paul 24.11.2022 22:40

поставить именно то, что должно быть возвращено из функции map?

Robin Zigmond 24.11.2022 22:43

я не знаю, сделал ли я что-то не так, но {List.category.map(({ name, id }) => { <p>{name}</p>; })} ничего не отображает

Jerémi paul 24.11.2022 22:54

потому что у вас нет оператора return - хотя вы можете обойтись без этого, если замените фигурные скобки на (...)

Robin Zigmond 24.11.2022 22:59

Другие вопросы по теме