问题描述
我已经设置loglevel
和loglevel-remote-plugin
来将客户端日志发送到服务器,以便对客户端问题进行故障排除。效果很好。
我还创建了一个<ErrorBoundary>
组件来捕获React组件冒泡时的错误。
我的问题是,当我注销componentDidCatch
函数中的错误时,日志消息仅出现在本地控制台中,而没有发送到服务器。
此外,通过render
函数,错误信息没有出现在屏幕上;因此,代码中的空条件处理。
如何停止react-devtools-backend.js处理对error
的调用? (以及关于如何使错误显示在屏幕上的奖励积分:)
谢谢
import React from 'react';
import log from 'loglevel';
// eslint-disable-next-line react/prefer-stateless-function
export default class ErrorBoundary extends React.Component {
constructor(props) {
super(props);
this.state = { hasError: false };
}
static getDerivedStateFromError(error) {
// Update state so the next render will show the fallback UI.
return { hasError: true };
}
componentDidCatch(error,errorInfo) {
// mmm sometimes this was being swallowed by react-dev-tools
// but users probably won't be running this hopefully?
log.getLogger('ErrorBoundary').error(
`error=${error}; errorInfo=${JSON.stringify(errorInfo)}`,);
}
render() {
if (this.state.hasError) {
// You can render any custom fallback UI
return (
<div>
<h1>Oops,something went wrong :(</h1>
<p>
The error:
{this.state.error ? this.state.error.toString() : ' was not captured!'}
</p>
<p>
Where it occured:
{this.state.info ? this.state.info.componentStack : ' is unkNown'}
</p>
</div>
);
}
return this.props.children;
}
}
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)