Javascript TypeScript的反应箭头组件的类型是什么？

组件文件

// Component A

import React, { ReactElement } from "react";

export const BacklogItemDashboard = (): ReactElement => (
    <h1>Backlog Item Dashboard</h1>
);

import // component

interface IMenuInfo {
    choice: string;
  **component: ReactElement;**  
    destination: string;
}

export const BacklogItem = (): ReactElement => {
    const menuInfo: IMenuInfo[] = [
        {
            choice: "Dashboard",
        **component: BacklogItemDashboard,**  // Red squigglies.
            destination: "dashboard".toLowerCase().replace(/ /g, ""),
        },
        ... [more menus deleted for brevity]
   ]

    const routes = menuInfo.map((info: IMenuInfo, key: number) => {
        return (
            <div key={key}>
                <Route
                    path={`${path}/${info.destination}`}
                    **component={info.component}** // another red squiggly
                />
            </div>
        );
    });

    return (
        <div>
            <ServiceItemContent
                menu={
                    <ServiceItemMenu
                        service="Backlog"
                        id={id}
                        choices={menuInfo}
                    />
                }
            >
                {routes}
            </ServiceItemContent>
        </div>
    );
};

//组件A
从“React”导入React，{ReactElement}；
export const BacklogItemDashboard=（）：ReactElement=>(
待办事项仪表板
);

使用组件文件

// Component A

import React, { ReactElement } from "react";

export const BacklogItemDashboard = (): ReactElement => (
    <h1>Backlog Item Dashboard</h1>
);

import // component

interface IMenuInfo {
    choice: string;
  **component: ReactElement;**  
    destination: string;
}

export const BacklogItem = (): ReactElement => {
    const menuInfo: IMenuInfo[] = [
        {
            choice: "Dashboard",
        **component: BacklogItemDashboard,**  // Red squigglies.
            destination: "dashboard".toLowerCase().replace(/ /g, ""),
        },
        ... [more menus deleted for brevity]
   ]

    const routes = menuInfo.map((info: IMenuInfo, key: number) => {
        return (
            <div key={key}>
                <Route
                    path={`${path}/${info.destination}`}
                    **component={info.component}** // another red squiggly
                />
            </div>
        );
    });

    return (
        <div>
            <ServiceItemContent
                menu={
                    <ServiceItemMenu
                        service="Backlog"
                        id={id}
                        choices={menuInfo}
                    />
                }
            >
                {routes}
            </ServiceItemContent>
        </div>
    );
};

导入//组件
接口IMenuInfo{
选择：字符串；
**组件：ReactElement；**
目的地：字符串；
}
export const BacklogItem=（）：ReactElement=>{
const menuInfo:IMenuInfo[]=[
{
选项：“仪表板”，
**组件：BacklogItemDashboard，**//红色曲线。
目标：“dashboard”.toLowerCase（）.replace（//g，”），
},
…[为简洁起见，删除了更多菜单]
]
const routes=menuInfo.map（（信息：IMenuInfo，键：number）=>{
返回(
);
});
返回(
{routes}
);
};

问题：在接口定义中，“组件”应该有什么类型来消除这两个红色的波形？也试过了，但仍然是红色的扭曲。我也试过了，但还是一样

编程新手。新的反应。JavaScript的新特性。让梦想应用程序尝试实现它。头部因不理解/运气不佳而受伤，并头部撞墙

只是需要一个快速修复-除了未知或任何-如果你有他们的链接，所以我会在周末研究，因为我相信这是基本的，已经问过和回答了。我是否提供了足够的代码来理解问题？谢谢

注意：我特别不想使用React.FC，因为本文和类似文章：

---

Jason

BacklogItemDashboard

是一个返回

元素的函数。它本身不是一个
元素

以下任何类型都描述了修复错误的组件。这意味着
BacklogItemDashboard
可分配给此类型，并且此类型可分配给
路由
组件的
属性


（）=>ReactElement
-一个不带参数并返回React元素的函数


（）=>React元素| null
-一个不带参数并返回React元素或null的函数


React.FC
-一种函数，除子函数外不接受任何参数，并返回React元素或null


React.ComponentType
-一种函数组件或类组件，除了子类之外不带任何参数


React.FC
-一个功能组件，使用路线提供的道具


React.ComponentType
-一种功能组件或类组件，采用路由器提供的道具



实际上，我同意“为什么我不使用React.FC”这篇文章的一般前提，即在编写函数时应该键入函数参数，而不是函数本身。我不认为这适用于当您谈论为作为函数的prop声明类型时，比如
组件
。我认为在这里使用
React.FC
没有任何问题。您不需要更改
BacklogItemDashboard
的类型，因为
（）=>ReactElement
可分配给
React.FC
。但如果您反对，您可以使用
（）=>ReactElement
尝试
导出const BacklogItemDashboard=（）：React.FC=>（…
更新问题，因为我特别不想使用React.FC，原因是：。
组件：（）=>ReactElement；
我实际上同意那篇文章的一般前提，即在编写函数时应该键入函数参数，而不是函数本身，但我认为这不适用于为函数类的道具声明类型，如
组件
。我看不出任何问题使用
组件：React.FC
或
组件：React.ComponentType
。您无需更改
BacklogItemDashboard
，
（）=>ReactElement
的类型，这两个组件都可以分配。谢谢！在这种情况下，根据您的解释，我们将使用React.FC。感谢您简单易懂的回答。：）