React错误边界无报错时返回的this.props.children是什么？

this.props.children是React组件的特殊内置属性，代表组件开闭标签之间嵌套的所有内容，不需要开发者手动显式传值，React会在渲染时自动完成赋值。

结合你给出的错误边界代码与使用示例：

<ErrorBoundary>
  <MyWidget />
</ErrorBoundary>

夹在<ErrorBoundary>开始标签和闭合标签之间的内容只有<MyWidget />这一个组件节点，所以此时无错误状态下返回的this.props.children，就是<MyWidget />对应的React元素，直接返回它的渲染效果，和你不在外层套ErrorBoundary、直接在当前位置写<MyWidget />的渲染结果完全一致。

根据标签中间嵌套内容的不同，this.props.children的数据结构会有区别：

• 开闭标签之间只嵌套单个React元素/组件时，children值为单个React元素对象
• 嵌套纯文本内容时，children值为对应的字符串
• 嵌套多个并列节点、文本、混合内容时，children值为包含所有嵌套内容的类数组结构，可以通过React.Children系列API遍历处理
• 开闭标签之间没有写任何内容时，children值为undefined

错误边界的核心逻辑就是做一层包裹代理：没有捕获到子树渲染错误时，就通过返回this.props.children原封不动透传渲染自己包裹的所有业务内容；一旦捕获到子树抛出的渲染错误，就把渲染内容替换成你定义的降级错误提示UI。

内容的提问来源于stack exchange，提问作者Thomasjd