iPhone6 ，iso10版本 scroll-view浮层 滑动穿透
- 当前 Bug 的表现（可附上截图）
在iphone6 ios10 中 scroll-view 浮层元素中滑动上层scroll-view 组件，会导致scroll-view 滑动失效，滑动穿透导致scroll-view下层page 滑动
- 预期表现
在iphone6 ios12 中 scroll-view 浮层元素中滑动上层scroll-view 正常
- 复现路径
- 提供一个最简复现 Demo
模板
<view class='mask' wx:if='{{show}}' catchtap='clickMask'> <!-- <view class="shade" wx:if="{{show}}" catchtouchmove="touchHandler" catchtap='close'></view> --> <view class='modal-content' wx:if='{{show}}' style='height:{{height}}' catchtap='childClick' hover-stop-propagation='true' > <scroll-view scroll-y class='main-content'> <slot></slot> </scroll-view> <view class='modal-btn-wrapper'> <view wx:if="{{isCancel}}" class='cancel-btn' bindtap='cancel'>取消</view> <view class='confirm-btn' bindtap='confirm'>确定</view> </view> </view></view> |
在一个页面中引用模板
<modal show="{{showModal}}" height='42%' bindcancel="modalCancel" bindconfirm='saveChildren' isCancel="{{false}}"> <view class='modal-title'>请完善家人信息</view> <view class="modal-list-section"> <view class="list-item"> <view class="name">姓名</view> <input type='text' bindinput='bindinputName' name="name" placeholder="请输入您的真实姓名" value="{{children.childrenName}}"></input> </view> <view class="list-item"> <view class="name">性别</view> <radio-group bindchange="radioChange" class="radio-group"> <label class="radio"> <radio value="男" checked="{{children.childrenSex==0}}" color="red" /> 男 </label> <label class="radio"> <radio value="女" checked="{{children.childrenSex==1}}" color="red" /> 女 </label> </radio-group> </view> <picker mode="date" bindchange="bindMultiPickerChange" end="{{endTime}}"> <view class="picker"> <view class="list-item"> <view class="name">出生日期</view> <input type='text' disabled placeholder="请选择出生日期" value="{{children.childrenBirthday}}"></input> <image style="width:20rpx;height:34rpx;margin-left:20rpx;" src="/images/right_arrow1.png"></image> </view> </view> </picker> <view class="list-item"> <view class="name">身高</view> <input type='number' maxlength='3' bindinput='bindinputHeight' name="stature" value='{{children.childrenHeight}}' placeholder="请填写身高"></input> <text>厘米</text> </view> <!-- <view class="confirm-btn" bindtap="saveChildren">确定添加</view> --> </view> </modal> |
强力驱动