将数组映射到数组内的对象内 React JS答案

【问题标题】：Map an array inside an object inside an array React JS将数组映射到数组内的对象内 React JS
【发布时间】：2020-05-15 05:10:35
【问题描述】：

我有一个对象数组，这些对象有一个对象，其中包含一个数组。我想映射"shoot: Array(6)"，以便列出这些项目。

我该怎么做呢？我能够映射名称、ID 和说明，但我无法访问和映射镜头对象然后拍摄数组。

当前代码信息：

{Object.values(instructions).map(({id, name, Instructions}, i) => {
          return (
        <div key={id}>
         <p><b>{name}</b></p>
         <p>{Instructions}</p>
        </div>

          );
        })}

【问题讨论】：

标签： arrays reactjs sorting arraylist

【解决方案1】：

连同 {id, name, Instructions} 一起销毁 Shots 对象，并从 Shots 对象映射出 shoots 数组。

{
  Object.values(instructions).map(({id, name, Instructions, Shots}, i) => {
      return (
        <div key={id}>
          <p><b>{name}</b></p>
          <p>{Instructions}</p>
          {
            Shots.shoots.map(shoot => (<p>{shoot}</p>))
          }
        </div>
      );
  })
}

【讨论】：

【解决方案2】：

试试这个代码：

{Object.values(instructions).map(({id, name, instructions, shots}, i) => {
      return (
    <div key={id}>
     <p><b>{name}</b></p>
     <p>{instructions}</p>
     <p>{shots.amount}</p>
     {shots.shoot.map(item => (
       <div>{item}</div>
     ))}
    </div>
      );
    })}

【讨论】：

【解决方案3】：

您可以像这样映射每个对象内的芽数组：

{Object.values(instructions).map(({id, name, Instructions}, i) => {
      return (
    <div key={id}>
     <p><b>{name}</b></p>
     <p>{Instructions}</p>
    {shoot.shoots.map(shoot => (<p>{shoot}</p>))}

    </div>

      );
    })}

【讨论】：