需启用enhanced="true"并配合硬件加速、优化节点结构、校验时间格式、统一单位换算及平台能力适配。

uni-app里用scroll-view实现物流时间轴卡顿怎么办
直接用scroll-view做垂直滚动时间轴,滑动不跟手、节点错位、iOS上突然跳帧——根本原因是它默认不启用硬件加速,且对大量view嵌套的渲染压力敏感。
- 加
scroll-y="true"同时必须配enhanced="true"(H5/小程序需额外开启) - 每个物流节点用
view包裹,但避免在节点内嵌套rich-text或image(尤其带远程src),优先用纯文本+图标字体 - 时间轴左侧的竖线别用
border-left,改用绝对定位的view+height: 100%,否则滚动时重绘开销大 - H5端若仍卡,给
scroll-view加style="transform: translateZ(0)"强制GPU加速
物流数据格式不对导致uni.createAnimation动画失效
想让新物流节点“逐条弹出”,结果动画只触发一次或完全没反应——大概率是后端返回的时间字段不是合法Date可解析格式,或者数组顺序没按时间倒序排好。
- 前端必须先用
new Date(item.time).getTime()校验每条time字段是否能转成有效毫秒数,无效值要过滤或兜底为Date.now() -
uni.createAnimation的step()必须在for循环里每次新建实例,不能复用同一个动画对象 - 节点动画建议用
opacity+translateY组合,别用scale,iOS下scale动画易失真 - 小程序真机调试时,
animationAPI 在onReady之后才可用,别在created里提前调
微信小程序里getLogistics接口报errCode: 90080001
调用uni.getProvider({service: 'logistics'})成功,但uni.getLogistics一执行就返回errCode: 90080001,意思是“未开通物流助手”或“单号不合法”,不是代码问题。
- 确认小程序后台已开通「物流助手」功能,并完成企业认证(个体户不行)
- 单号必须是快递公司官网可查的真实单号,测试用的
SF123456789CN这种模拟号会直接报错 - 调用前检查
provider是否为weixin,其他平台(如支付宝)不能混用该API - 该接口仅支持部分快递公司,
expressCode必须传官方编码(如sf、zto),不能传中文或全称
跨端时间轴样式不一致:App/H5/小程序怎么统一节点间距
写死margin-top: 30rpx在H5看着刚好,到App变成挤在一起,小程序又太松——rpx在非微信环境解释规则不同,且App端默认使用px单位。
- 所有间距统一用
px,配合uni.upx2px()动态换算(例如uni.upx2px(60)返回App/H5的实际像素值) - 节点容器设
display: flex,用flex-direction: column+gap属性控制间距(注意小程序基础库需≥2.21.0) - 避免用
line-height撑高节点,改用padding,否则文字字号缩放时高度失控 - 时间文案的
font-size别用rpx,固定28rpx在某些安卓机上会模糊,建议14px+font-weight: 400
物流时间轴最麻烦的从来不是画线或动画,而是各家快递返回的字段名不统一、时间格式五花八门、还有小程序平台能力割裂——数据清洗和兜底逻辑写得越早,后面越省事。










