蒋继发 (ThaddeusJiang)
·
2024-04-11 Remix 改变了我编写 dialog 的方式
💡
原文中文，约3200字，阅读约需8分钟。
📝
内容提要
Remix改变了编写dialog的方式，使用Modal Route实现了更合理的业务逻辑拆分，不需要手动维护dialog状态。优点包括更容易处理页面状态和多级弹窗，缺点是依赖框架。
🎯
关键要点
- Remix 改变了编写 dialog 的方式，使用 Modal Route 实现更合理的业务逻辑拆分。
- React 之前使用命令式编写 dialog UI，代码复杂且不易维护。
- React 初期采用声明式编写，但存在无用代码和状态管理问题。
- 使用 Radix UI 的 DialogTrigger 可以减少 useState 的复杂性。
- 回归 HTML native dialog 避免了 useState 爆炸，但需要配合 useRef 使用。
- Remix 的 Modal Route 设计无需手动维护 dialog 状态，简化了代码。
- Modal Route 使得业务逻辑拆分更合理，易于测试和处理页面状态。
- 处理多级弹窗变得简单，只需重复 Outlet，避免多层嵌套。
- 缺点是依赖于 Remix 框架，不符合 Web Standards。
🏷️
标签
➡️
