Horizon 购物车：页面、抽屉与数量更新

本文基于 Horizon 4.2.0，源码固定到 5acd1b6（核验于 2026-10-07）。结论限于此 commit，不表示其他版本行为相同；本篇为源码分析，未完成店铺运行验证。

购物车页面和购物车抽屉是同一购物车数据的两种展示入口。初始内容、数量变化和空车状态需要沿同一条更新链核对。

页面与抽屉分别组织外壳

sections/main-cart.liquid 组织标题、条目和摘要区块，并预先提供空车模板；snippets/cart-drawer.liquid 组织抽屉与对话框，在相应设置和页面条件下输出。

两种入口都使用 snippets/cart-items-component.liquid 包装子内容。这个片段本身主要输出组件容器；购物车条目和金额摘要继续查看 snippets/cart-products.liquid 与 snippets/cart-summary.liquid。

因此，“使用同一个组件”不等于页面和抽屉的所有标记完全相同。复制摘要、修改条目或调整空车说明时，要回到各入口确认上下文。

数量更新由浏览器组件处理

assets/component-cart-items.js 注册购物车条目组件，处理数量变化并发出购物车修改请求。数量修改请求本身附带需要刷新的分区，返回结果中有本组件分区 HTML 时直接替换，没有时再单独重新请求该分区；发请求前还会取消这些分区尚未完成的渲染。它也消费购物车事件中的分区 HTML，缺少可用结果时同样回退到重新请求。

刷新模式还会区分页面与抽屉。assets/cart-drawer.js 继续处理抽屉场景，因此仅查看 Liquid 中的 data-drawer 不能解释打开、关闭和更新的完整行为。

本版本新增了浏览器后退恢复的处理：页面从往返缓存恢复，或后退导航从 HTTP 缓存重建时，条目组件监听 pageshow 并以不使用缓存的方式重新渲染分区，抽屉组件随后重新计算吸底摘要。因此“后退后看到旧条目”在本版本不应再被当作预期现象。

空车是一条真实分支

删除最后一件商品会改变条目、摘要和空状态的组合。源码提供空车模板，但这不是浏览器测试已经通过的证据。验证时应观察删除前后的条目、金额、数量徽标、焦点和抽屉状态，并检查服务端是否接受了修改。

购买按钮的即时反馈与最终购物车也应分开记录：一次加购成功后，当前页面和抽屉是否都反映新内容，属于购买流程之后的集成验证。

建议的最小验证范围

覆盖空车进入、有商品进入、修改数量、删除最后一件、请求失败、离开后用浏览器后退返回、页面和抽屉两种设置。金额、折扣与数量规则应使用真实测试商品核验。本篇未执行购物车写请求、折扣或结账验证。