Javascript 在嵌套在数组中的对象中的数组中迭代

我正在寻找一个关于react的问题的帮助。我需要遍历嵌套在每个对象中的数组ItemTypes，这些对象都嵌套在useState数组中。我试过使用for循环，但我不确定我会把它放在哪里。我们将非常感谢您在正确的方向上给予的任何帮助或轻推

干杯

import React, { useState } from 'react';
import './StudentProjectLib.css'
import SideBarCheckbox from './checkboxSideBar'


function ProjectSideBar() {

    const [checkboxes, setCheckboxes  ] = useState([

        { title: 'Subscription', itemTypes: ['Free', 'Premium'], id:1 },
        { title: 'Activity Type', itemTypes: ['Animation', 'Game', 'Chatbot', 'Augmented Reality'], id: 2 },
        { title: 'Year Level', itemTypes: ['1-4', '5-6', '7-8', '9-13'], id:3 },
        { title: 'Subject Matter', itemTypes: ['Computer Science', 'Maths', 'Science', 'Language', 'Art', 'Music'], id:4 },

    ])
        
    return (
        <div>
            {checkboxes.map((checkbox) => (
                <div className='ProjectSideBar'>
                    <h1 className= 'TableHeader'>{checkbox.title}</h1>
                   <div>
                    <SideBarCheckbox className = 'CheckBoxContainer'/>{checkbox.itemTypes}
                    </div>
                    
                </div>    
                
            )
                
                
            )}

        </div>
    )}


export default ProjectSideBar;

import React，{useState}来自“React”；
导入“./StudentProjectLib.css”
从“./checkboxSideBar”导入SideBarCheckbox
函数ProjectSideBar（）{
常量[复选框，设置复选框]=useState([
{title:'Subscription'，项目类型：['Free'，'Premium']，id:1}，
{标题：“活动类型”，项目类型：[“动画”、“游戏”、“聊天机器人”、“增强现实”]，id:2}，
{标题：'年级别'，项目类型：['1-4'，'5-6'，'7-8'，'9-13']，id:3}，
{标题：'主题'，项目类型：['计算机科学'，'数学'，'科学'，'语言'，'艺术'，'音乐']，id:4}，
])
返回(
{复选框.map（（复选框）=>(
{checkbox.title}
{checkbox.itemTypes}
)
)}
)}
导出默认项目侧栏；

如果我正确理解了您的问题，您只需再次使用

.map（）

返回(
{复选框.map（（复选框）=>(
{checkbox.title}
{checkbox.itemTypes.map（（项）=>(
{item}//或您想对该项执行的任何操作
)}
)}
)}

您使用与主阵列完全相同的

.map

机制。谢谢！我对所有事情都很陌生，所以我发现很多时候答案已经在我面前出现了。