父级设置缩放后 子级movable-view拖动不到边界?
[图片] 父级设置后,moveable-view 最多只能移动到这个地方
<view class="page-body">
<view class="page-section" style="transform: scale(0.75);">
<view class="page-section-title">movable-view区域小于movable-area</view>
<movable-area>
<movable-view x="{{x}}" y="{{y}}" direction="all">text</movable-view>
</movable-area>
</view>
<view class="btn-area">
<button bindtap="tap" class="page-body-button" type="primary">click me to move to (30px, 30px)</button>
</view>
</view>
Page({
data: {
x: 0,
y: 0,
scale: 2,
},
tap(e) {
this.setData({
x: 30,
y: 30
})
},
tap2() {
this.setData({
scale: 3
})
},
onChange(e) {
console.log(e.detail)
},
onScale(e) {
console.log(e.detail)
}
})
movable-view {
display: flex;
align-items: center;
justify-content: center;
height: 100rpx;
width: 100rpx;
background: #1AAD19;
color: #fff;
}
movable-area {
height: 400rpx;
width: 400rpx;
margin: 50rpx;
background-color: #ccc;
overflow: hidden;
}
.max {
width: 600rpx;
height: 600rpx;
}
.page-section{
width: 100%;
margin-bottom: 60rpx;
}
.page-section:last-child{
margin-bottom: 0;
}
.page-section-title{
font-size: 28rpx;
color: #999999;
margin-bottom: 10rpx;
padding-left: 30rpx;
padding-right: 30rpx;
}