使用Reactjs在列表中的列表

时间:2019-07-09 04:49:30

标签: reactjs

在包含React列表中的列表的许多变量的正确格式是什么。

下面的代码是我所拥有的,并且似乎可以正常工作。我只想仔细检查。

const mainObject = [
  {
    Object1: [
      {
        id: 1,
        linkto: "#Home",
        linkname: "Home"
      },
      {
        id: 2,
        linkto: "#Experience",
        linkname: "Experience"
      }
    ],
    Object2: [
      {       
        id: 1,
        linkto: "#Home",
        linkname: "Home"
      },
      {
        id: 2,
        linkto: "#Experience",
        linkname: "Experience"
      }
    ]
  }
];

export default mainObject;

1 个答案:

答案 0 :(得分:0)

无需提及对象1,对象2等。它们已经是数组中的对象。

    const mainObject = [
          {
            id: 1,
            linkto: "#Home",
            linkname: "Home"
          },
          {
            id: 2,
            linkto: "#Experience",
            linkname: "Experience"
          },
          {       
            id: 1,
            linkto: "#Home",
            linkname: "Home"
          },
          {
            id: 2,
            linkto: "#Experience",
            linkname: "Experience"
          }
    ];

    export default mainObject;

您可以使用map循环并对数组中的每个对象进行一些操作。在做出反应时,您将执行以下操作:

mainObject.map((obj)=> {
    console.log(obj);
    return <li key={obj.id}><a href={obj.linkto}>{obj.linkname}</a>
});

// With implicit return
mainObject.map((obj)=> <li key={obj.id}><a href={obj.linkto}>{obj.linkname}</a>);