Как получить ключ от объекта в функции карты?

Question

Как получить ключ от объекта в

{this.state.data.map((object, index) => (
      <div>object.key</div>

    ))}

Например, если this.state.data было

 [{mykey1:23},{mykey2:24},{mykey3:34}]

Я бы хотел, чтобы он вернулся

 <div>mykey1</div>
 <div>mykey2</div>
 <div>mykey3</div>

Answer 1

Использование Object.keys():

{this.state.data.map(obj => <div>{Object.keys(obj)[0]}</div>)}

Answer 2

Вы не интерполируете значение, которое хотите отобразить для начала. Вы должны поместить значения, которые вы хотите оценить, в фигурные скобки, чтобы они отображались из ваших состояний / реквизитов. Хотя я предполагаю, что ваш пример был напечатан на скорую руку, и это не причина, почему это не работает для вас. Чтобы получить ключи, определенные в объекте, вы должны использовать Object.keys (), который возвращает массив строк со всеми ключами. Затем вы можете перебрать полученный массив и отобразить его в JSX-представлении.

Вот рабочая скрипка для вашей справки: https://jsfiddle.net/2q19rpaz/

let data = [{mykey1:23},{mykey2:24},{mykey3:34, mykey4:34}];
return data.map((object, index) => {
    return Object.keys(object).map((key, index) => {
        return (<div>{key}</div>);
    })
})