主要观点:介绍了 Sequin 这一 Postgres CDC 工具,其 web 控制台由 LiveView + LiveSvelte 构建,分享了使用该栈的设计模式,重点关注表单编写。
关键信息:
- 每个 Ecto 模型对应一个
Form
模块,可能是 LiveComponent 或 LiveView。 DatabasesLive.Form
LiveView 处理数据库表单,根据创建或更新设置初始状态和更改集。- 用 JSON 与 Svelte 表单组件通信,编码/解码结构体,定义默认值。
- Svelte 表单组件通过
live.pushEvent
与 LiveView 交互,有form_updated
和form_submitted
等事件处理。 - LiveView 事件处理函数处理前端发送的事件,进行数据处理和路由。
- 利用 LiveView 进行路由,Svelte 用
data-phx-link
/data-phx-link-state
导航。
重要细节: - 在
mount/3
中根据id
判断是创建还是更新来初始化状态。 put_changesets
根据is_edit?
切换更改集函数。encode_database
编码数据库结构体。- Svelte 组件初始化
form
对象,通过bind:value
绑定输入。 decode_params
用于反序列化前端事件 payload。handle_event
处理各种事件,如form_updated
更新更改集,form_submitted
进行提交处理。- 路由在 LiveView 中处理,Svelte 通过事件通知 LiveView 关闭表单等。
- 对于 Supabase 连接转换,后端处理并发送回复。
- 团队感觉使用 LiveView/LiveSvelte 组合生产力高,但仍在探索边界和代码分配。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。