14、Remix中的错误处理与会话管理

Remix中的错误处理与会话管理

1. Remix中的错误处理

在应用开发中，错误处理是至关重要的一环，它直接影响着用户体验和应用的稳定性。Remix提供了强大的错误处理机制，下面我们来详细了解一下。

1.1 嵌套错误处理

在处理费用详情页面时，我们引入了嵌套的 ErrorBoundary 组件，这一组件展现了强大的功能。即使出现错误，费用概述列表依然能够正常渲染，这就是嵌套错误处理的魅力所在。具体操作如下：
1. 为费用详情页面实现嵌套的 ErrorBoundary 组件。
2. 按照同样的方式，为收入详情页面实现相同的体验。

在之前的开发中，当引入费用删除表单时，可能会出现一些不愉快的用户体验。例如，当用户在费用详情页面（ dashboard/expenses/$id ）快速一次性删除所有费用时，可能会进入一个未找到页面。这是由于 dashboard/expenses/$id 的 deleteExpense 函数中的重定向逻辑存在问题：

async function deleteExpense(request: Request, id: string): Promise<Response> {
  const referer = request.headers.get('referer');
  const redirectPath = referer || '/dashboard/e