如何從地圖功能中的對象獲取密鑰？

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>);
    })
})