(参数) children: ReactNode 对象可能是 'null' 或 'undefined'

Posted

技术标签:

【中文标题】(参数) children: ReactNode 对象可能是 \'null\' 或 \'undefined\'【英文标题】：(parameter) children: ReactNode Object is possibly 'null' or 'undefined'(参数) children: ReactNode 对象可能是 'null' 或 'undefined' 【发布时间】：2022-01-21 12:18:05 【问题描述】：

1-（参数）children：ReactNode 对象可能是“空”或“未定义”。

2-属性“类型”在类型“布尔”上不存在 |反应儿童 |反应片段 |反应门户'。 类型“字符串”上不存在属性“类型”。

import Head from "next/head"

interface AppProps
  children: React.ReactNode

const Layout = ( children : AppProps) => 
  return (
    <>
       <Head>
       <title>children.type.name</title>
       </Head>
   </>
  )

export default Layout

【问题讨论】：

【参考方案1】：

类型ReactNode 是联合类型boolean | React.ReactChild | React.ReactFragment | React.ReactPortal | null | undefined。如您所见，这包括null 和undefined，因此您必须处理代码中children 将是null 或undefined 的可能性。

如何处理取决于您自己。您无法在 Layout 中呈现任何内容，或者引发错误，或者呈现一些占位符文本而不是 children.type.name。

【讨论】：

以上是关于(参数) children: ReactNode 对象可能是 'null' 或 'undefined'的主要内容，如果未能解决你的问题，请参考以下文章

[React] Use React.ReactNode for the children prop in React TypeScript components and Render Props(代码

“类型 ' children: Element[]; pictureUrl: string; ' 不可分配给类型 'IntrinsicAttributes & children?: Reac

[react] 在react中遍历的方法有哪些？它们有什么区别呢？

将 ref 转发到 react.FC 给出类型错误：类型'IntrinsicAttributes & Props & children :?反应节点

错误：类型“void”不可分配给类型“ReactNode”

打字稿如何在父组件中传递道具