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
相关推荐
第七玩家6 小时前
React-异步队列执行方法useSyncQueue
前端·javascript·react.js
IT、木易14 小时前
大白话react第十六章React 与 WebGL 结合的实战项目
前端·react.js·webgl
市民中心的蟋蟀17 小时前
第十六章 React中常用的的错误处理方法 【下】
前端·javascript·react.js
ffiyu17 小时前
【React进阶系列第三课】组件函数什么时候被执行
前端·react.js
ffiyu17 小时前
【React进阶系列第二课】JSX 与 React Element
前端·react.js
ffiyu17 小时前
【React 进阶系列第一课】组件就是函数
前端·react.js
市民中心的蟋蟀19 小时前
第十六章 React中常用的的错误处理方法 【上】
前端·javascript·react.js
Bigger19 小时前
useEffect 的底层是如何实现的?(美团面试原题)
前端·react.js·面试
winyh521 小时前
从零开始封装React UI 组件库并发布到NPM
前端·react.js·前端框架
蠟筆小新工程師1 天前
React Native 建構apps的好處在哪裡
javascript·react native·react.js