Индекс объекта JS возвращает все значения в объекте, а не фактический индекс

Question

Позвольте мне объяснить это очень быстро, когда я получаю данные из базы данных, есть родительский объект, а внутри есть массив объектов, и я хочу написать правильный путь, чтобы я мог получить доступ к определенным элементамв БД.

При получении данных я сохраняю две переменные, например:

for (let a in obj) {
    list.push(obj[a]);
    keys.push(a);
}
this.setState({
    list: list,
    keys: keys,
});

При выполнении этого кода будет напечатано следующее:

console.log(this.state.keys[index]);

HZlgUZ21vKbungnxaxDJXrTUr2z1

Это всегда возвращает точный родительский объект id

Но проблема в том, что я не могу получить доступ к индексу вложенных элементов:

console.log(this.state.list[index]);

Object {-LORYsI9mLP8mu_2BTKS: Object, -LORZVOq8SMUgTOPgpXK: Object, -LORZtqZeg3nyOW4p9I1: Object, -LOYbElg81jbPtao2nl4: Object}

для всего, что я ищу, - это не 10221023 *

я приложил изображение базы данных, чтобы вы могли видеть, как оно выглядит

Вот минимальное представление представления:

const listItems = this.state.list.map((item, index) =>
        Object.values(item).map(nestedItem => (
<div>
  {nestedItem.title}
  <button
   onClick={() => this.update(index)}
   >
  CLICK
  </button>
</div>
  ))
);

Это довольно легко решить, просто я все еще изучаю основные концепции программирования, но эти вложенные объекты всегда меня расстраивают.Пожалуйста, кто-нибудь пришел ко мне на помощь

Answer 1

Можете ли вы попробовать применить приведенную ниже концепцию в вашем примере?

Предположим, у вас есть структура JSON, такая как

var obj = {
        a: {
             blue:16,
             green:30,
             red:39
           },
        b: {
             orange:56,
             yellow:34,
             white:35    
           },
        c: {
             black:3,
             brown:43,
             purple:12  
            }
        };

Теперь, когда вы запускаете цикл for...in над этим объектом

for (let key in obj) {
   list.push(obj[key]); 
   keys.push(a);
}

obj[key] вернет значение {blue:16,green:30,red:39}, которое в итоге помещается в массив списка

Если вам нужны значения синего, зеленого и красного, вы можете сделать что-то вроде

Object.keys(obj[key]); //will return an array ['blue', 'green', 'red']