SuperAPI AI 工具集

hotwire

通用与其它

查看项目

更新于 10-15 20:05

技能介绍

用途:Hotwire 用于在 Rails 7+ 中构建快速、现代、渐进增强的 Web 应用,通过发送 HTML 而非 JSON,将业务逻辑保留在服务端,减少 JavaScript 依赖。

主要能力:Turbo Drive 拦截链接点击与表单提交,用 fetch 替换 body 并合并 head,window、document、html 在导航间保持;可用 data: { turbo: false } 对特定元素禁用,并可自定义 .turbo-progress-bar 进度条。Turbo Frames 用 turbo-frame 元素包裹页面片段,实现局部导航,支持 id、src、loading="lazy"、target(_top、_self 或 frame ID)、data-turbo-action 等属性,导航中带 aria-busy,完成后设 complete。Turbo Streams 以 turbo-stream 元素传递 DOM 变更,共 9 种动作:append、prepend、replace、update、remove、before、after、morph、refresh;可通过 HTTP 响应(format.turbo_stream)、内联渲染或 WebSocket/SSE 广播(broadcast_append_to、broadcast_remove_to、turbo_stream_from、turbo-stream-source)。Stimulus 用 data 属性增强服务端渲染 HTML,控制器支持 targets、values(Array、Boolean、Number、Object、String 五种类型及默认值)、classes、actions(event->controller#method、事件简写、全局事件、键盘过滤器、:stop/:prevent/:self/:capture/:once/:passive 选项、action 参数),并有 connect、disconnect、target 与 value 变更回调。

使用方式:在 Rails 7+ 中通过 Import Maps 固定 @hotwired/turbo-rails 与 @hotwired/stimulus,控制器文件按 snake_case 或 kebab-case 命名,HTML 中用 kebab-case 标识符。可用 bin/importmap pin lodash 或 bin/importmap pin chartkick --from jsdelivr 添加依赖。

适用场景:需要服务端渲染、渐进增强、局部刷新与实时更新的 Rails 应用。

限制:资料未提供具体版本兼容范围、性能数据、收费信息或平台限制,暂未提供。