uni.previewimage不支持平滑缩放，因其为原生封装api，未暴露手势、缩放状态及动画参数；必须手写组件，用movable-area+movable-view实现，并注意h5渲染偏移、scale值显式设置、image模式限制、will-change优化及transform-origin动态计算等关键细节。
uni.previewImage 本身不带缩放动画，也不能自定义缩放行为。要实现「上传后点击预览 + 平滑缩放」，必须绕过它，手写一个支持 transform: scale() + transition 的轻量预览组件。
为什么不能直接用 uni.previewImage 做平滑缩放
这个 API 是原生封装的，所有平台（小程序/H5/App）都不暴露手势控制、缩放状态、动画时长等参数。你调用它，只能弹出一个“黑底白图”的标准弹窗，双击无反应，缩放卡顿，也没有过渡效果。不是你配置错了，是它压根没留钩子。
想加 transform 动画、双击缩放、拖拽边界限制？必须自己接管整个渲染和交互逻辑。
用 movable-area + movable-view 快速起步但要注意坑
官方组件确实能省事，但它默认的缩放动画很生硬，且在 H5 端会因 CSS 渲染机制导致缩放中心偏移；小程序端则对 scale-value 更新响应滞后，容易卡顿或跳变。
-
scale-min和scale-max要显式设为1和3，别依赖默认值（某些版本默认scale-min=0.5，会导致小图拉伸失真） -
movable-view内部<image></image>必须用mode="widthFix"或aspectFit，禁用scaleToFill—— 否则缩放时图片会被强制裁切 - H5 端需额外加
style="will-change: transform;"到movable-view上，否则频繁缩放易掉帧 - 不要在
movable-view外层套scroll-view或swiper，它们会劫持 touch 事件，导致缩放失效
真正平滑的关键：transform-origin 动态计算 + cubic-bezier
双击缩放“指哪打哪”，核心不是改 scale，而是实时算点击点相对于图片左上角的坐标，并转成 transform-origin 值。否则所有缩放都以 center 为中心，体验像被钉住一样僵硬。
示例关键逻辑：
const rect = imageRef.getBoundingClientRect();
const xInImg = (e.touches[0].clientX - rect.left) / currentScale;
const yInImg = (e.touches[0].clientY - rect.top) / currentScale;
this.transformOrigin = `${xInImg}px ${yInImg}px`;
this.scale = this.scale === 1 ? 2.5 : 1;
同时，CSS 中必须配：
transition: transform 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
别用 ease 或 linear —— 前者太慢，后者太机械。这个贝塞尔曲线是 iOS 原生相册缩放的真实节奏。
上传预览联动时最容易漏的一件事
用户上传完图片，立刻点击预览，此时图片可能还没加载完成。如果直接把 src 绑定给 movable-view 里的 <image></image>，缩放逻辑会因 offsetWidth/Height 为 0 而计算错 transform-origin，导致第一次双击缩放位置乱飞。
务必等 image.onload 触发后再启用缩放逻辑，或用 uni.getImageInfo 预取宽高：
uni.getImageInfo({ src: url }).then(res => {
this.imgWidth = res.width;
this.imgHeight = res.height;
this.ready = true; // 才允许响应 touch 事件
});
没有这一步，H5 端大概率首屏缩放错位，小程序端则可能报 NaN 坐标错误。
