公告列表
公告列表
收藏
回答

左右滑动白屏

框架类型 问题类型 终端类型 微信版本 基础库版本
小程序 Bug 微信iOS客户端 7.0.3 wechatlib:2.6.6

AppID(小程序ID)

wx83b2233adae96c67

原始ID

gh_31d4e0188ef8

进入单元页面显示房号列表，该列表横向数据多时，需要左右滑动才可以看到，ios左右一滑动该局域白屏，无法查看。

<view class="flex1 flexRow scroll_box"> 层内白屏，其他显示正常。

.panel {
    margin: 0;
}
 
.panel-heading.floorTile {
    border: 0rpx solid #000!important;
}
 
.floorTile {
    border: 2rpx solid #eee;
    text-align: center;
    font-size: 32rpx;
    padding: 10rpx 30rpx;
}
.flexRow .statu0 {
    border-color: #fff;
     
    color: #666;
}
 
.flexRow .statu1 {
    border: 1px solid #fff;
    background: red;
    color: #fff;
}
 
.flexRow .statu2 {
    border: 1px solid #fff;
    background: #FFFF00;
     
}
 
.nav-tabs {
    margin-top: 30rpx;
    border-bottom: 1px solid #ddd;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}
 
.nav-tabs .flex {
    margin-bottom: -2rpx;
    text-align: center;
    padding: 12rpx 0;
}
 
.nav-tabs .active {
    color: #555;
    cursor: default;
    background-color: #fff;
    border: 2rpx solid #ddd;
    border-bottom-color: transparent;
}
 
.tableWrap {
    margin-top: 30rpx;
    border: 1px solid #4E4C3F;
}
 
.br {
    padding: 10rpx;
    border: 1px solid #4E4C3F;
    text-align: center;
    font-size: 37rpx;
    letter-spacing: -2rpx;
}
 
.te {
    font-size: 26rpx;
}
 
.ar0 {
    background: #F8F2F2;
     
    display: inline-block;
}
.disn { display: none;}
.ar1 {
    background: #edf9fd;
    width: 81vw;
    display: inline-block;
}
 
.ar2 {
    background: #fff;
    width: 81vw;
    display: inline-block;
}
 
.ar3 {
    background: #F8F2F2;
    width: 81vw;
    display: inline-block;
}
 
.floorInfos {
    position: fixed;
    left: 0;
    background: #fff;
    height: 124rpx;
    min-width: 100%;
    bottom: 1rpx;
    overflow-x: auto;
    overflow-y: auto;
    text-align: center;
}
 
.floorInfo {
    left: 0;
    bottom: 0;
    position: relative;
}
 
.floorInfo.flexRow {
    flex-wrap: nowrap;
    background: #FEF7E5;
    color: green;
}
 
.floorInfo .tit,.floorInfo .info {
    border: 2rpx solid green;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 10rpx 0;
}
 
.floorInfo .flex {
    margin-right: -2rpx;
    margin-bottom: -2rpx;
    max-width: none;
}
 
.default {
    margin-right: 16rpx;
    padding: 6rpx 12rpx;
    background: #F8F2F2;
}
 
.green {
    margin-right: 16rpx;
    padding: 6rpx 12rpx;
    background: #00B500;
}
 
.red {
    padding: 6rpx 12rpx;
    background: red;
    margin-right: 16rpx;
}
 
.yellow {
    padding: 6rpx 12rpx;
    background: #FFFF00;
    margin-right: 16rpx;
}
 
page {
    min-height: 100%;
}
 
.bgwrap {
    min-height: 100%;
    padding: 20rpx;
    margin-bottom: 120rpx;
    bottom: 120rpx;
    box-sizing: border-box;
}
 
.bg {
    padding: 10rpx;
    box-sizing: border-box;
    background: #0E7794;
    border-radius: 10rpx;
    min-height: 100%;
    border: 6rpx solid #F5E5CA;
    background: #FEF7E5;
}
 
.scroll_box {
    width: 100%;
    overflow: hidden;
    background: #fff;
    white-space: nowrap;
}
 
.item_list {
    width: 160rpx;
    height: auto;
    margin-right: 23rpx;
    display: inline-block;
}


最后一次编辑于  2019-11-01
回答关注问题邀请回答
收藏

3 个回答

  • 张泥鳅互联网+营销运营家
    张泥鳅互联网+营销运营家
    2019-11-01
    <view class="bgwrap" style="background-image: url('{{bgurl}}');">
        <view class="bg">
            <view class="floorTile panel-heading">{{floortitle}}</view>
            <view class="flexRow demo">
                <view class="flex1 flexRow">
                    <view class="red"></view>
                    <view class="flex1">已售</view>
                </view>
                <view class="flex1 flexRow">
                    <view class="default"></view>
                    <view class="flex1">未售</view>
                </view>
                <view class="flex1 flexRow">
                    <view class="yellow"></view>
                    <view class="flex1">小定</view>
                </view>
            </view>
            <view class="wrap tableWrap" hidden="{{show}}">
                <view class="tableTop flexRow">
                    
                     
                    <view class="flex1 flexRow scroll_box">
                        <scroll-view class="scroll-view_x" scrollX="true" style="width: auto;overflow:hidden;">
                            <view class="flex1 ar{{index}} " wx:for="{{homelist}}" wx:key="unit">
                                <view class="flex1 flexCloum">
                                    <view class=" br">-</view>
                                    <view class="flexRow" wx:for="{{item}}" wx:key="unit">
                                        <block wx:if="{{item.houselist!=''}}">
                                            <view bindtap="roominfo" class="br flex1 statu{{item.pay_statu}}" data-floor_no="{{item.floor_no}}" data-house_no="{{item.house_no}}" data-houseid="{{item.id}}" data-statu="{{item.pay_statu}}" data-unit_no="{{item.unit_no}}"  data-userlevel="{{homelist[0].userlevel}}" wx:for="{{item.houselist}}" wx:key="unit">{{item.house_no}}</view>
                                        </block>
                                    </view>
                                </view>
                            </view>
                        </scroll-view>
                    </view>
                     
                </view>
            </view>
        </view>
    </view>


    2019-11-01
    有用
    回复
  • 灵芝
    灵芝
    2019-11-01

    你好，可以更新微信版本重试

    也可以调试小程序定位一下问题，正式版调试方式如下：

    方式1、https://developers.weixin.qq.com/miniprogram/dev/api/base/debug/wx.setEnableDebug.html

    方式2、先在开发版或体验版打开调试，再切到正式版就能看到vConsole

    2019-11-01
    有用
    回复 1
    • 张泥鳅互联网+营销运营家
      张泥鳅互联网+营销运营家
      2019-11-01
      开启调试后，体验版和正式版都是，滑动白屏，点击下vConsole里面就显示了。
      2019-11-01
      赞
      回复
  • 小满
    小满
    2019-11-01

    放个代码片段出来看看吧

    2019-11-01
    有用
    回复 1
请 登录 后发表内容
相关问题
相关文档
问题标签
appid白屏listbackgroundcolorbottom