使用 Typescript 进行反应 | 功能组件| 类型“boolean”不可分配给类型“ReactElement<any,any>”

Question

我已经建立了一个使用 TypeScript 和 React 的项目。所以我继续创建一个使用 Children 属性的布局组件。这是我当前的代码：

import React from 'react';

type LayoutProps = {
    children: React.ReactNode
}

const Layout: React.FC<LayoutProps> = ({children}) => (
    <>
        {children}
    </>
)

export default Layout;

由于某种原因，我收到标题中提到的错误。

Type 'boolean' is not assignable to type 'ReactElement<any, any>'.

我已经搜索了一下，但仍然不确定为什么会收到此错误。我还应该提到这是一个 NextJS 项目。当 NextJS 尝试编译代码时，我收到此错误：

Answer 1

问题似乎是 Typescript 不明白这是 JSX。正如Robert Kawecki所建议的，从 .ts 更改为 .tsx 文件解决了问题！