全书目录

第三十一篇:Remix 完全指南 —— Web 原生航运港宇宙

十二、完整数据流:一次进港 + 一次改单,到底发生了什么

1 分钟 123 字 第 575 / 962 个阅读单元

看一遍完整链路:

text
1. 用户打开 /ships/9527/edit
   ↓
2. Remix 匹配到相关父子路由
   ↓
3. 执行这些路由的 loader
   ↓
4. 服务端返回 HTML + loader 数据
   ↓
5. 页面显示编辑表单
   ↓
6. 用户提交 <Form method="post">
   ↓
7. action() 收到 request.formData()
   ↓
8. 写数据库
   ↓
9. return redirect("/ships/9527")
   ↓
10. Remix 导航到详情页
    ↓
11. 新页面相关 loader 自动重跑
    ↓
12. 页面展示最新数据

如果不跳转而留在原页,流程通常是:

text
提交表单
  ↓
action 执行
  ↓
返回成功结果
  ↓
当前页相关 loader 自动 revalidate
  ↓
页面展示最新状态

请注意,“写完之后自动重验证” 是 Remix 特别值钱的能力。

因为大量业务页面里,真正麻烦的不是“发出请求”,而是“请求之后谁该更新”。

Remix 直接把这个问题内建进了港口调度系统。