如何使用 map function 顯示 json 在 React.js 上的組件鍵上有空格

Question

我正在嘗試使用股票市場的 API，因此我在提交表單並收到此 JSON Bellow 並將其值存儲在 Hook 時進行了 API 調用。

    "Meta Data": {
        "1. Information": "Daily Prices (open, high, low, close) and Volumes",
        "2. Symbol": "IBM",
        "3. Last Refreshed": "2020-12-04",
        "4. Output Size": "Compact",
        "5. Time Zone": "US/Eastern"
    },
    "Time Series (Daily)": {
        "2020-12-04": {
            "1. open": "123.9700",
            "2. high": "127.3800",
            "3. low": "123.6400",
            "4. close": "127.2000",
            "5. volume": "5522760"
        },
        "2020-12-03": {
            "1. open": "124.1600",
            "2. high": "124.8600",
            "3. low": "123.2900",
            "4. close": "123.6100",
            "5. volume": "4548161"
        }
}

所以我創建了兩個簡單的組件：StockList 和 StockItem，StockList 用於渲染所有 StockItem，我無法訪問 StockItem 中 JSON 的值，因為我不知道如何顯示這些鍵上有空格的數據。 通常json是這樣的：

  {
    "id": 1,
    "name": "Leanne Graham",
    "username": "Bret",
    "email": "Sincere@april.biz",
    "address": {
      "street": "Kulas Light",
      "suite": "Apt. 556",
      "city": "Gwenborough",
      "zipcode": "92998-3874",
      "geo": {
        "lat": "-37.3159",
        "lng": "81.1496"
      }
    }

使用 map 很容易顯示，如下所示：

users.map((user) => {
   return(
     <p>{user.name}</p>
     <p>{user.username}</p>
   )
});

當我嘗試使用 map 來解決這個問題時，我得到了未定義的屬性。

Answer 1

訪問鍵上有空格的數據。

user['key'] => 

example : user['first name']

 let a = {"first name": 'dileep'}; console.log(a['first name'])