React-Redux 错误页面管理答案

【问题标题】：React-Redux error page managementReact-Redux 错误页面管理
【发布时间】：2016-09-14 01:18:54
【问题描述】：

我们有一个 react-redux 项目，我们正在尝试设置错误传播和错误页面显示机制。

到目前为止，我们一直在做的是：当异步 api 调用或其他地方发生错误时，我们会触发一个操作并修改根级组件 App。在根级减速器中，我们将错误字段设置为传播错误的状态。当观察到错误时，我们会呈现错误页面而不是我们拥有的内容。

所以流程是这样的： Component A -> A action -> App Reducer -> App component - Render errorPage。

但问题是错误组件的状态仍然存在。并且由于错误字段保持在状态，应用程序继续呈现错误页面。我们基本上需要一种机制，以便每当用户触发新操作或呈现错误页面时，都会将状态中的错误字段重置为 {}。

我们找不到解决此问题的好方法。它看起来很常见，任何人以前都可能遇到过。一般来说，我们如何处理异步错误传播并相应地显示错误页面。

【问题讨论】：

【解决方案1】：

解决这个问题的正确方法是使用：

componentWillUnmount() {
    this.props.handleErrorReset();
}

handleErrorReset 函数基本上会触发一个动作，在错误状态下触发错误值的重置，与此相符：

const clearErrorState = (state) => state.set('error', fromJS({}));

componentWillUnmount 基本上是在相关组件卸载后立即执行，因此非常适合在不再需要的状态下重置或清理值。

【讨论】：

【解决方案2】：

如果你使用的是路由系统，比如 react-router，你可以实现一个错误页面来显示来自 reducer 的错误）并且你可以让任何其他页面删除 reducer 中潜在的现有错误。

【讨论】：

是的，我们确实使用了 react-router。我们可以通过正确的路由器显示错误页面，并且我们实现了这一点，但我们的状态仍然因先前的错误而变脏。当我尝试从组件更新状态（通过触发减速器功能的操作）时，我收到了关于在渲染方法中更新状态的投诉。有没有办法在渲染方法之外做到这一点？
当然：试试componentWillReceiveProps()
componentWillReceiveProps() 的问题是当您再次更新状态时，应用程序重新渲染并且不再显示错误页面。所以这就像你显示错误页面，状态被更新并且你丢失了错误页面，因为状态中的错误不再存在。