l***@163.com
l***@163.com
  • 发布:2020-10-15 17:50
  • 更新:2020-10-15 17:50
  • 阅读:1144

【报Bug】nvue waterfall 组件,分页加载数据时候,渲染顺序错乱

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: window10

HBuilderX类型: 正式

HBuilderX版本号: 2.9.3

手机系统: iOS

手机系统版本号: iOS 12.0

手机厂商: 苹果

手机机型: iphone6

页面类型: nvue

打包方式: 云端

项目创建方式: HBuilderX

示例代码:
<waterfall :column-count="columnCount" alwaysScrollableVertical="true" class="waterfall-list" column-gap="0" :enableBackToTop="enableBackToTop" :scroll-y="scrollY"> <uni-refresh class="refresh" @refresh="onrefresh" @pullingdown="onpullingdown" :display="refreshing ? 'show' : 'hide'"> <div class="refresh-view"> <image class="refresh-icon" :src="refreshIcon" :style="{width: (refreshing || pulling) ? 0: '32px'}" class="{'refresh-icon-active': refreshFlag}"></image> <uni-load-more v-if="refreshing" class="loading-icon" status="loading" :contentText="loadingMoreText"></uni-load-more>
<text class="loading-text">{{refreshText}}</text>
</div>
</uni-refresh>
<uni-cell v-for="(item, index) in dataList" :key="item.id" :id="item.id" @click="clickHandle(item, index)" @appearHandle="apperaHandle">
<text>{{index}}</text>
<waterfallImage :checked="item.checked" :uri="item.uri"></waterfallImage>
</uni-cell>
<uni-cell v-if="isNoData">
<emptyPage :hasDataEmpty='true' :dataContent="暂无${typeName}"></emptyPage>
</uni-cell>
<loading v-if="isLoading" class="loading-box">
<view class="loading-more">
<text class="loading-more-text">{{loadingText}}</text>
</view>
</loading>
</waterfall>

操作步骤:

分页加载数据就会有问题
检查发现是 loading 组件显示导致的

<loading v-if="isLoading" class="loading-box">  
                <view class="loading-more">  
                    <text class="loading-more-text">{{loadingText}}</text>  
                </view>  
            </loading>

预期结果:

第二页数据应该再第一页后面

实际结果:

第二页数据应该再第一页前面

bug描述:

加载第二页时候,第二页数据跑到第一页前面了。
无论加载多少页,第一页的数据一直被排在最后。

2020-10-15 17:50 负责人:无 分享
已邀请:

该问题目前已经被锁定, 无法添加新回复