详细问题描述
movable-view发布支付宝小程序 change事件里添加更新data里的代码,放大图片再移动,图片会变成初始状态;change事件里代码加上就异常,注释掉就正常,很奇怪。如用原生支付宝小程序则正常,
重现步骤
[步骤] 放大图片再移动图片,图片会变成初始状态
[结果]放大图片再移动,图片会变成初始状态
[期望]放大图片再移动,以最后的放大后移动后状态为准
IDE运行环境说明
HBuilderX
[IDE版本号]2.6.5.20200314
[windows版本号] 1903 win10家庭中文版 操作系统版本18362.720
uni-app运行环境说明
支付宝小程序
[运行端版本号]支付宝小程序开发工具 V 1.5.10
[HBuilderX创建]
[编译模式说明] HBuilderX uni-app默认的编译模式
App运行环境说明
[Android版本号] 9
[手机型号] 荣耀8X JSN-AL00a
附件
[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]
[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]
[App安装包或H5地址]
[可重现代码片段]
<template>
<view>
<movable-area style="width:450rpx;height:600rpx;overflow:hidden">
<movable-view
@change="moveChange"
@scale="scaleChange"
scale-min="1"
:x="imgX"
:y="imgY"
:style="{ width: imgW + 'rpx', height: imgH + 'rpx' }"
direction="all"
scale="true"
>
<image mode="aspectFit" :style="{ width: imgW + 'rpx', height: imgH + 'rpx' }" :src="photoSrc"></image>
</movable-view>
</movable-area>
</view>
</template>
<script>
import imgUrl from '../../image/rsf20031129DE8FF11AF947C587F48181023F85A8.jpg';
export default {
data() {
return {
imgX: 0,
imgY: 0,
imgW: 497,
imgH: 600,
photoSrc: imgUrl,
newImgX: 0,
newImgY: 0
};
},
methods: {
moveChange(e) {
console.log(e.detail);
this.newImgX = e.detail.x;
},
scaleChange(e) {
console.log(e);
}
}
};
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
display: flex;
justify-content: center;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
</style>
完整代码见附件、异常现象视频见附件
[QQ] 664336285