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
相关推荐
ZHOU_WUYI1 小时前
React与Docker中的MySQL进行交互
mysql·react.js·docker
霸王蟹3 小时前
React 19中如何向Vue那样自定义状态和方法暴露给父组件。
前端·javascript·学习·react.js·typescript
purpleseashell_Lili4 小时前
项目制作流程
react.js
GISer_Jing6 小时前
Vue 和 React 状态管理的性能优化策略对比
vue.js·react.js·性能优化
chenbin___14 小时前
react native text 显示 三行 超出部分 中间使用省略号
javascript·react native·react.js
霸王蟹1 天前
React Fiber 架构深度解析:时间切片与性能优化的核心引擎
前端·笔记·react.js·性能优化·架构·前端框架
outstanding木槿1 天前
react中安装依赖时的问题 【集合】
前端·javascript·react.js·node.js
霸王蟹1 天前
React中useState中更新是同步的还是异步的?
前端·javascript·笔记·学习·react.js·前端框架
霸王蟹1 天前
React Hooks 必须在组件最顶层调用的原因解析
前端·javascript·笔记·学习·react.js
Coding的叶子2 天前
React Flow 节点事件处理实战:鼠标 / 键盘事件全解析(含节点交互代码示例)
react.js·交互·鼠标事件·fgai·react agent