Scenario Description:
Excessive self-defined pop-layer content, whole pages require scrolling slide case
solve
1. The layout of the entire package as the root node in all view, dynamic binding and scroll-view of the scroll-y property
<scroll-view style="scroll-y:{{isScroll}}" scroll-y="{{isScroll}}" bindscrolltolower='lower'>
</scroll-view>
2. Set the Page style file attribute is hidden overflow-y
page{
background: #fff;
position: absolute;
font-size: 36rpx;
width: 100%;
height: 100%;
display: block;
overflow-y: hidden;
}
scroll-view {
height: 100%;
}
3. The scroll-view setting style file height attribute value of 100%
4. Open custom click event popups, isScroll change is false, the click event pop off, change the value true isScroll
<view class="sorting-list{{!isstart1?' chioce-list-hide':' chioce-list-show'}}">
<view style="overflow: scroll;height:80%;-webkit-overflow-scrolling:auto;">
<view wx:for="{{slist1}}" catchtap="onclicks1" data-id="{{item.id}}" data-index="{{index}}" class="sorting-item" hover-class="click-once" wx:key="userInfoListId" >{{item.name}}</view>
</view>
</view>
Click event
opens1: function (e) {
console.log(e)
this.setData({
isstart: false,
isScroll: false
});
switch (e.currentTarget.dataset.item) {
case "2":
if (this.data.isstart1) {
this.setData({
isstart1: false,
isScroll:true
});
}
else {
this.setData({
isstart1: true,
isScroll: false
});
}
break;
}
},
Precautions
<view style="overflow: scroll;height:80%;-webkit-overflow-scrolling:auto;">
This passage to the outer wrap in the rendering of the content area
overflow: scroll; height: 80%; it is allowed to scroll the content area
; -Webkit-overflow-scrolling: auto; this is the content area will be bouncing on ios, auto finger off the screen to stop the slide, touch is allowed to bounce
bindscrolltolower='lower'
After using the scroll-view pull the bottom of the page becomes ineffective, this method can retrieve the situation bottoming