回到试衣间套装页实现逻辑
试衣间(套装)· 实现逻辑
套装列表、筛选与详情弹层的数据流与跳转约定;试穿动作会进入 AI智能试衣并预填服装。
1. 流程摘要
套装数据来自 mock/data.json,经 lib/fitting-room-data.ts 导出为 OUTFITS;画廊组件按性别筛选展示,点击卡片打开弹层浏览多图。
弹层内「试穿」使用 router.push('/fitting-room/ai-fit?id=' + …),AI智能试衣页根据 URL 查询参数预填对应套装。
2. 关键事项
- 外链图片在开发环境可走
/api/fit-image同源代理,逻辑见lib/fitting-room-image-url.ts。 - 试衣间浏览本身不计入应用历史扣费;计费发生在 AI智能试衣成片成功后。
- AI智能试衣与衣柜的实现逻辑见 实现逻辑 · AI智能试衣。
3. 核心代码摘录
试穿跳转:带套装 id 进入 AI智能试衣(app/fitting-room/fitting-room-modal.tsx)
router.push(`/fitting-room/ai-fit?id=${encodeURIComponent(outfit.id)}`);