hwc-navigation-content

导航与内容显示

使用 Turbo Drive 和 Turbo Frames 实现导航与内容发现行为。

核心工作流

1. 确定导航模式：标签页、分页、延迟帧加载、分面搜索，或自定义渲染／缓存生命周期。
2. 优先确定 URL 和历史记录的归属（data-turbo-action、帧 src、查询参数、前进／后退行为）。
3. 使用帧生命周期和访问事件更新活动状态、请求参数和滚动位置恢复。
4. 在 Turbo 缓存快照生成前清理临时 UI 状态。
5. 验证前进／后退导航和刷新路径下的行为。

注意事项

• 在加载／渲染事件中更新活动状态／标签页状态，而不是在点击意图事件中更新。
• 确保 URL 中的筛选条件和分页状态是规范的。
• 避免在缓存快照中留下临时 UI 痕迹。
• 审慎使用延迟加载；验证加载边界和观察器行为。

按需加载参考资料

仅打开当前请求所需的文件。

• 标签页式帧导航：references/2023-06-20-turbo-frames-tabbed-navigation.md
• 分页 + 历史记录管理：references/2023-07-04-turbo-frames-pagination.md
• 延迟帧生命周期：references/2023-09-26-turbo-frames-lazy-loading-lifecycle.md
• 滚动位置恢复：references/2023-09-12-turbo-frames-scroll-position-restoration.md
• 缓存生命周期清理：references/2023-05-23-turbo-drive-cache-lifecycle.md
• 自定义渲染拦截：references/2023-05-09-turbo-drive-custom-rendering.md
• 条件式即时点击策略：references/2024-02-13-turbo-drive-conditional-instant-click.md
• 使用 Stimulus 的分面搜索：references/2024-12-10-stimulus-turbo-frames-faceted-search.md
• Markdown 预览流程：references/2024-10-08-turbo-frames-markdown-preview.md

完整目录请参阅 references/INDEX.md。

转交给相关技能

• 表单提交和验证行为：使用 hwc-forms-validation
• 基于推送的实时更新：使用 hwc-realtime-streaming
• 媒体专属交互设计：使用 hwc-media-content
• 通用反馈／过渡效果和感知性能优化：使用 hwc-ux-feedback
• 非导航类 Stimulus API 基础知识：使用 hwc-stimulus-fundamentals