微信小程序scroll-view高设置100%在苹果6p下的兼容性问题
home.wxml
<view class='main'>
<view class='crumbs'></view>
<view class='title'></view>
<view class='scrollView'>
<scroll-view style='height:100%'>
我是scroll-view
</scroll-view>
</view>
</view>
home.wxss
page{
width:100%;
height:100%;
background-color: #0aae1d;
}
.main{
width:100%;
height:100%;
display:flex;
flex-direction:column;
}
.crumbs,.title{
width:100%;
height:80rpx;
line-height:80rpx;
background-color: rgba(255,255,255,.3);
}
.title{
background-color: rgba(0,0,0,.3);
}
.scrollView{
width:100%;
height:1rpx;
flex-grow:1; // 这样写在苹果6P下scroll-view组件是高不会继承父元素的高,其他都正常
background-color: rgba(104,104,104,.3);
}
scroll-view {
width:100%;
height:100%;
background-color: red;
}
正确做法
.scrollView{
width:100%;
height: %; // 按照开发者工具调试百分比
flex-grow:1;
background-color: rgba(104,104,104,.3);
}
欢迎访问