React.ReactElement 与 React.ReactNode

  • React.ReactNode 在 JSX 中作为子元素传递的所有可能类型的并集,这是对子元素的一个非常宽泛的定义。
js 复制代码
<RNode><p>One element</p></RNode>
 <RNode>
   <>
     <p>Fragments for</p>
     <p>More elements</p>
   </>
 </RNode>
 <RNode>1</RNode>  
 <RNode>Hello</RNode>
 <RNode>{null}</RNode>
 <RNode>{true}</RNode>
 
 <RNode />    // Error: Must have children though
  • React.ReactElement 只包括 JSX 元素,而不包括 JavaScript 原始类型,如 string 或 number。
js 复制代码
<RElement><p>More elements</p></RElement>
 <RElement>
   <>
     <p>More elements</p><p>More elements</p>
   </>
 </RElement>
 
 <RElement>1</RElement>     // Error: Must be a JSX element
 <RElement>Hello</RElement>    // Error: Must be a JSX element
 <RElement>{null}</RElement>    // Error: Must be a JSX element
 <RElement>{true}</RElement>    // Error: Must be a JSX element
 <RElement />    // Error: Must have children though
相关推荐
光影少年1 天前
RN 样式特点:Flex 布局默认、没有像素单位、样式不能级联
react native·react.js·掘金·金石计划
小蚂蚁i1 天前
React Hooks 原理深度解析:从会用到真正懂
前端·react.js
索西引擎1 天前
【React】虚拟 DOM:原理、机制与核心价值分析
前端·react.js·前端框架
光影少年1 天前
react的View/Text/Image/ScrollView 常用组件注意事项
开发语言·前端·javascript·react.js·前端框架
索西引擎1 天前
【React】React Fiber 架构:设计动机、核心机制与调度策略分析
前端·react.js·架构
索西引擎1 天前
【React】JSX:JavaScript 语法扩展的本质、编译机制与表达能力分析
前端·javascript·react.js
hxy06012 天前
React-Call让你的React组件像异步函数一样调用
前端·react.js
Patrick_Wilson2 天前
从一次 Safari 白屏,聊聊 CDN 外置 React 的坑与前端监控盲区
前端·react.js·cdn
我是大卫2 天前
【图】React源码解析-从底层数据结构、调度器、闭包原理到源码设计模式,深挖useState的全部核心机制
react.js·源码