加购弹窗需深拷贝goodsdata并用selectedspecs数组存选中规格，点击时$nexttick校验库存；下拉动画用transform+absolute定位防卡顿；飞入动画须用uni.createselectorquery获取坐标并适配ios状态栏偏移；多商品共用弹窗需key强制重建组件。
加购弹窗怎么动态显示规格数据并保持联动
弹窗里规格不更新、选了没反应，基本是因为数据没绑定或监听失效。关键不是“渲染出来”，而是“选中后能实时影响购物车数量和价格”。goodsData 必须是深拷贝后的结构，不能直接传接口原始响应；否则 v-model 或 @click 修改内部字段时，Vue 无法触发响应式更新。
- 规格列表用
v-for="(spec, idx) in goodsData.specs"渲染，每个spec.values再套一层循环，避免扁平化拼接导致索引错乱 - 选中状态存成数组
selectedSpecs = ['颜色:红色', '尺寸:M']，而不是对象嵌套，方便后续查库存和组合 SKU - 每次点击一个规格值，都要调用
this.$nextTick(() => { /* 检查当前组合是否可售 */ })，否则 DOM 还没更新，selectedSpecs和界面不同步 - 库存判断逻辑必须放在
handleSpecClick里：先过滤出所有匹配该组合的skuList项，再取stock > 0的最小值作为可选最大数量
为什么下拉选择动画卡顿或点不中
常见原因是用了 v-show 或 opacity 做显隐，但没配 transition 或没加 will-change: transform。iOS 微信里尤其明显——它对非 transform/opacity 的属性动画做软件渲染，一卡就是整秒。
- 下拉区域必须设
position: absolute，且父容器加overflow: hidden，否则滚动时菜单会溢出 - 动画用
transform: scaleY(0) → scaleY(1)，配合transform-origin: top，比 height 动画更稳 - 别在
@click里直接写dropShow = !dropShow，要包一层this.$nextTick，否则 Vue 批量更新还没完成，getBoundingClientRect()拿到的是旧高度 - 真机调试时发现点不中？检查是否被
z-index更高的 tabBar 或自定义导航栏遮挡，把弹窗z-index设到 9999 并加top: env(safe-area-inset-top)
飞入购物车动画为什么起点偏移、轨迹歪斜
不是贝塞尔曲线参数不对，而是坐标没减页面滚动偏移。uni-app 在 H5 和小程序里 pageYOffset 行为不一致，直接用 window.scrollY 会返回 0。
- 起点必须用
uni.createSelectorQuery().select('.add-btn').boundingClientRect()，不能用ref+getBoundingClientRect()，后者在某些安卓 WebView 下返回错误值 - 终点（购物车图标）要加
id="cart-icon"，同样用boundingClientRect()查，查完立刻执行exec()回调，别等$nextTick - 计算位移时，x/y 都要减去
uni.getSystemInfoSync().windowHeight - uni.getSystemInfoSync().screenHeight + scrollTop这个偏移量，iOS 微信额外还要减掉statusBarHeight - 动画元素必须用
document.createElement('view')动态创建，append 到document.body，否则被v-if组件销毁时会中断动画
多商品共用一个弹窗时怎么避免数据污染
最典型的问题：点第一个商品弹窗，选好规格加购，再点第二个商品，弹窗里还是上一个商品的数据。这不是缓存问题，是组件复用没重置状态。
- 弹窗组件加
key，比如:key="currentGoodsId"，强制 Vue 卸载重建实例 - 不要在弹窗组件
data()里直接 return 共享的goodsData对象，改用props接收，并在watch里 deep clone 一次 -
selectedSpecs和quantity必须在show变为 true 时清空，否则用户上次选的还在 - 加购按钮的
ref要动态绑定，比如:ref="'addBtn' + goods.id"，不然多个按钮共用一个 ref 名，querySelector只拿到第一个
实际项目里，最难缠的是 iOS 微信里 boundingClientRect() 返回的 y 坐标比真实值小 44px（状态栏高度），这个偏移得单独适配；还有 H5 端滚动时动画元素跟着抖动，必须给它加 position: fixed 而不是 absolute。这些细节不试真机根本发现不了。
