时间戳

首页 > 解决方案 > Javascript JSON-如何映射到多个对象

javascript - Javascript JSON-如何映射到多个对象

问题描述

我尝试从本地 json 文件中显示多个对象的值，这里是“groundName”。我的目的是一次映射多个对象，这样我就可以避免重写对象的名称来访问我需要的值。我没有设法找到这个特定问题的答案，所以我来这里询问。

在这里，通过写入对象的名称，我确实检索到了我想要的值。 

import  { useState, useEffect } from "react";
import grounds from './../../UballersGroundsData.json';

export default function Groundlist() {
    const [groundNames, setgroundNames] = useState([grounds]);

    return(
        <div>
            <h1>Hello world!</h1> 
            <ul>
                {groundNames.map(([index]) => (
                    <li key={(index.ground1.groundId)}>{index.ground1.groundName}</li>
                    ))}

                  
                   

            </ul>

        </div>
    )
}

这里是 .json 文件的一部分

{
  "ground1":{
    "groundId": "2",
    "address": "77-101 Quai Branly, Paris, France",
    "city": "Paris",
    "country": "France",
    "groundName": "Bir-Hakeim",
  },
  "ground2":{
    "groundId": "26585",
    "address": "1 Rue du Petit Cardinal, Bordeaux, France",
    "city": "Bordeaux",
    "country": "France",
    "groundName": "1 Rue du Petit Cardinal"
  }
}

谢谢你的帮助！=D

标签： javascriptjsonreactjs

解决方案

<ul>
    {
         Object.values(groundNames).map((object) => (
             let obj = groundNames[object];
             <li key={(obj.groundId)}>{obj.groundName}</li>
         ))
    }
</ul>

试试上面的代码

推荐阅读