React中如何在AppInsightsErrorBoundary的onError中获取未处理错误

你遇到的onError回调拿到空对象的问题，是因为没有正确使用组件提供的回调参数。AppInsightsErrorBoundary的onError函数实际接收两个参数：错误实例（Error）和React错误信息对象（ErrorInfo），调整参数接收方式即可获取真实错误：

<AppInsightsErrorBoundary 
  onError={(error, errorInfo) => <MyErrorComponent error={error} errorInfo={errorInfo} />} 
  appInsights={reactPlugin}
>
  {/* 应用根组件内容 */}
</AppInsightsErrorBoundary>

在你的MyErrorComponent中，就可以通过error对象访问错误详情，比如error.message、error.stack；errorInfo里的componentStack还能帮你定位触发错误的组件层级。

如果调整后仍然拿到空对象，建议检查@microsoft/applicationinsights-react-js的版本，旧版本（比如v2.x及以下）的回调参数结构可能不同，升级到最新稳定版（v3.x+）即可解决。

另外需要注意：AppInsightsErrorBoundary已经自动完成了错误上报到Application Insights的操作，不需要你在回调里额外调用trackException，只需专注于自定义错误UI即可。

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