我开始学习TypeScript，目前我正在将React代码转换为TypeScript。然后我遇到了这个问题，我无法解决它。基本上，我通过已实现值的props组件传递状态，并希望此状态将在其他组件上识别，但当我试图将状态Map到其他组件时，我会出错。
来自MenuItems.tsx的错误：
属性“map”在类型“MenuItemsProps '. ts”上不存在（2339）
Project.tsx出错
类型“ClassType[]”不可分配给类型“Dispatch〈SetStateAction〈ClassType[]〉〉”。类型“ClassType[]”未提供签名“”的匹配项（值：设置状态操作〈类类型[]〉）：void'.ts（2322）
代码如下：Project.tsx

import Data from '@/assets/data/Data'

const Project = () =>  {

    const [menuItems, setMenuItems] = useState<typeof Data>(Data); 

    return (
         <MenuItems menuItems={menuItems} />  // Error here in menuItems
    )
}

MenuItems.tsx

import Data from '@/assets/data/Data'
type MenuItemsProps = {
    menuItems: React.Dispatch<React.SetStateAction<ClassType[]>>
}

const MenuItems = (menuItems: MenuItemsProps) => {
    return (
        <div className='menuitem'>
            <h1>sample</h1>
            {
                menuItems.map((item: ClassType) => {   // the Error is coming from map
                    return <div className='menuitem-list' key={item.id}>
                                <h2>{item.title}</h2>
                           </div>
                })
            }
        </div>
    )
}

Data.ts

import { ClassType } from "../types/Types";
const portfolios: Array<ClassType> = [
    {
        id: 1,
        title: 'Example1',
    },
    {
        id: 2,
        title: 'Example1',
    },
    {
        id: 3,
        title: 'Example1',
    },
]
export default portfolios;

Types.ts

export type ClassType = {
    id: number,
    title: string,
}

所以我尝试使用Dispatch和SetStateAction，但不幸的是没有帮助
---编辑---
在以下评论的帮助下，问题已得到解决：我在{ menuItems }上添加了花括号：
const MenuItems =（{ menuItems }：菜单项属性）=〉{
然后将这个“React.Dispatch〈React.SetStateAction〈ClassType[]〉〉”替换为ClassType[]，问题是：
type MenuItemsProps = { menuItems：ClassType[] }