javascript - 在地图内映射以获取子数组
问题描述
我有以下数据:
{
"data": {
"site": {
"siteMetadata": {
"siteLinks": [
{
"title": "title 1",
"submenu": [
{
"title": "test-1",
}
]
},
{
"title": "title 2",
"submenu": [
{
"title": "test-2",
}
]
},
{
"title": "title-3",
"submenu": [
{
"title": "test-3",
}
]
},
{
"title": "title-4",
"submenu": [
{
"title": "test-4",
}
]
}
]
}
}
} }
我正在尝试映射以获取子菜单标题。我已经设法使用以下代码获得第一个标题,但我正在努力将地图放入地图中。
import React from "react"
const Header = props => (
<div>
{props.siteLinks.map((item, key) => (
<div>
<li key={item.title}>{item.title}</li>
</div>
))}
</div>
)
export default Header
任何帮助将非常感激
解决方案
您可以在第一个地图功能中添加第二个地图功能
import React from 'react';
const Header = props => (
<div>
{props.siteLinks.map((item, key) => (
<div key={item.title}>
<li>{item.title}</li>
{item.submenu.map((x)=>(
<li key={x.title}>{x.title}</li>
))}
</div>
))}
</div>
)
export default Header;
推荐阅读
- java - 如何使用 WireMock 存根多个参数 Springboot Restful POST Endpoint
- android - 当设备关闭 1 小时或更长时间时,Alarmmanager 不会触发广播接收器
- node.js - 在生产中反应连接到没有端点的 API
- shell - 识别文件夹的构建类型
- azure - Azure Linux Webapp 的启动命令
- javascript - 如何将我的函数转换为变量以执行语句数组
- regex - 如何使用正则表达式从句子中删除以小写字母开头的单词
- reactjs - 动态变化的 ReactJS 常量(动态全局)
- python - 如何找到一个点的最近邻居和另一个不是最近邻居的点?
- python - 如何使用 seaborn 绘制多色图形?