React Redux 单页应用程序：使用整页渲染处理 API 404答案

【问题标题】：React Redux one-page app: handle an API 404 with full page renderReact Redux 单页应用程序：使用整页渲染处理 API 404
【发布时间】：2017-08-17 19:49:39
【问题描述】：

在使用 react-router 实现导航的 React 单页应用程序中，当在页面中呈现组件时遇到请求的 API 错误时，呈现整页错误的最佳做法是什么？

更具体地说，我知道 react-router 有一个很好的方法来为根本没有映射的 URL 路由实现 404 错误处理程序，但是当路由确实匹配映射路由与 URL 的动态部分时（例如一个 data-id）导致渲染一个组件，该组件发出一个响应 404 错误的请求，用错误视图替换整个反应渲染视图的最佳实践是什么？

示例场景：

Route = "/profile/person/:PersonId",
后端不存在人员 ID 1234。
用户访问“/profile/person/1234”
profile/person/:PersonId 路由的组件呈现，并发出请求以获取人员 ID 1234 的配置文件数据，返回 404，这实际上意味着给定的 URL 是 404，虽然没有反应-路由器。

【问题讨论】：

标签： reactjs error-handling react-redux

【解决方案1】：

这只是一个建议，因为我真的不相信有你所要求的明确的最佳实践。

ApiService.fetch(url).then(
  onSuccess(result) => { /* dispatch page fetch success */ },
  onError(result) => { /* dispatch page fetch error */ }
);

然后像这样构建您的应用程序：

<App>
  { error ? <ErrorHandler /> : <PageHandler /> }
</App>

这种结构将缩短您在遇到服务器错误的有效路由上的页面呈现，并改为呈现错误内容。

【讨论】：