React JS，停止在生产中显示错误

Question

最近我们在线推出了第一个React JS应用程序。但是，当人们打开网站，然后移动到另一个选项卡并关闭他们的计算机时，他们回来时会显示一条错误消息。这是他们看到的（不是这个确切的图像，但相同的想法）：

用户刷新页面后，再次完美运行......

我想知道两件事：

1）有没有办法隐藏这些错误？

2）是否有一种很好的方式来刷新页面/如果它们出现？

Answer 1

您正在使用开发版本。来自create-react-app docs（我假设它是create-react-app）：

  

当您准备部署到生产环境时，请创建一个缩小的捆绑包   与npm run build。

但是未捕获的错误会导致整个树被卸载，所以我建议使用componentDidCatch hook.

Answer 2

您应该在App组件上方创建error boundary一级，并在下面将其称为Wrapper。

＆＃13;

＆＃13;

class Wrapper extends React.Component {
  componentDidCatch(error, info) {
    // Do something useful with error like logging to error reporting system
    // then force reload (if that's what you want):
    window.location.reload(true);
  }
  render() {
    return (<App/>)
  }
}

＆＃13;

＆＃13;

＆＃13;