javascript - React-Redux 错误页面管理

标签 javascript reactjs error-handling redux

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

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

所以流程是这样的:组件 A -> A Action -> App Reducer -> App 组件 - 渲染错误页面。

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

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

最佳答案

这个问题的正确解决方案是使用:

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

handleErrorReset 函数基本上会触发一个操作,该操作会触发错误状态下错误值的重置,符合以下内容:

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

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

https://facebook.github.io/react/docs/component-specs.html#unmounting-componentwillunmount

关于javascript - React-Redux 错误页面管理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37284613/

相关文章:

javascript - 如何在 React + Apollo GraphQL 中查询先前查询的结果?

javascript - 通过将鼠标悬停在另一个图像上来隐藏动画图像

reactjs - 为什么我的 http 库的错误处理程序捕获应用程序中的*所有*运行时错误?

reactjs - 当您需要在仍在从父组件获取数据的情况下渲染某些内容时,最佳实践是什么?

javascript - 如何在纯 JS 文件中获取 i18next.t()?

powershell - 从PowerShell中的New-WebServiceProxy捕获错误

c - 有没有更好的方法来进行 C 风格的错误处理?

javascript - javascript中的递归和返回

javascript - 在不更改 HTML 的情况下使用递增的类号创建简单的新父元素

vba - 通过Excel VBA作为电子邮件附件发送的文件始终损坏