在数组中映射数组答案

【问题标题】：Mapping an array inside an array在数组中映射数组
【发布时间】：2021-08-02 11:01:49
【问题描述】：

我正在尝试映射数据数组，但不断收到错误消息：无法读取此行未定义的属性“映射”：{number.s[0].l['serial'].map(option => 这是我的代码：

{this.state.serials.map((number) => {
    return number.s && number.s.length? 
    (
        <h2 > {number.s[0].za}</h2>
        <ul>
        {number.s[0].l['serial'].map(option => 
          <li>{option}</li>
        )}
      </ul>
    ) : null
})}

这是我的数据：

[
   {
     "s": [
            {
              "l": [
                     { "serial":"49:42:06:00:20:4e" }, 
                     { "serial":"49:42:06:00:3b:29" }
                   ],
              "za":"900"
            }
          ]
   },
   {
     "s": [
            {
              "l": [{ "serial":"777" }],
              "za":"5559"
            }
          ]
   }
]

有谁知道我应该如何定义从“l”映射连续剧的路径？我用许多不同的方式定义它，但是，我似乎无法让它发挥作用。

提前致谢！

【问题讨论】：

l 是一个数组。 number.s[0].l.map(option => <li>{option.serial}</li>)
@AshwynHorton 谢谢！有用。如果您愿意，可以将其发布为答案，我会接受。
太好了，我在下面发布了。谢谢

标签： javascript reactjs typescript react-native

【解决方案1】：

l 是一个数组类型。这里有一个简单的修复。

number.s[0].l.map(option => <li>{option.serial}</li>)

【讨论】：

【解决方案2】：

你应该映射number.s[0].l.map((item)。

下面是完整的render函数

render() {
        return(
            this.state.serials.map((number)=>{

                return ( number.s[0].za &&
                    <div>
                        <h2>{number.s[0].za}</h2>
                        {number.s[0].l && number.s[0].l.length > 0 &&
                        <ul>
                            {number.s[0].l && number.s[0].l.length>0 &&
                            number.s[0].l.map((item)=>{return   <li>{item.serial}</li>})
                            }
                        </ul>

                        }
                </div>
             )
            })
        )

    }

【讨论】：