shmily138
shmily138
  • 发布:2020-10-21 14:56
  • 更新:2021-09-24 00:06
  • 阅读:2243

【报Bug】iOS端在nvue页面waterfall中refresh和loadmore组件失效不触发下拉刷新和上拉加载更多

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: Windows 10 专业版,版本号1809,操作系统版本:17763.1282

HBuilderX类型: 正式

HBuilderX版本号: 2.9.3

手机系统: iOS

手机系统版本号: iOS 13.4

手机厂商: 苹果

手机机型: iphone SE

页面类型: nvue

打包方式: 云端

项目创建方式: HBuilderX

示例代码:
<waterfall class="listview" column-count="2" column-width="auto" left-gap="15" right-gap="15" column-gap="16"  
         :scroll-y="true">  
            <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) of dataList" :key="item.id">  
                <caligraphyItem :mountItem="item" @click="goDetail(item)"></caligraphyItem>  
            </uni-cell>  
            <loading class="loading-more" :display="isLoading ? 'show' : 'hide'" @loading="loadMore">  
                <loading-indicator animating="true"></loading-indicator>  
                <text class="loading-more-text">{{loadingText}}</text>  
            </loading>  
        </waterfall>

操作步骤:

1.nuve页面中waterfall组件中引入refresh组件和loadmore组件
2.编写对应的事件回调函数
3.下拉刷新或上拉加载更多没有效果

预期结果:

正常触发下拉刷新或上拉加载更多

实际结果:

waterfall组件无法上下滑动,无法触发下拉刷新或上拉加载更多

bug描述:

1.iOS端在nvue页面waterfall中refresh和loadmore组件失效不触发下拉刷新和上拉加载更多(没有数据时或者数据较少一页能显示完全时)
2.当数据较多(一页显示不全时)可以正常滑动waterfall组件同时也可以正常触发下拉刷新和上拉加载更多

  1. list组件中refresh和loadmore组件正常
2020-10-21 14:56 负责人:DCloud_iOS_XHY 分享
已邀请:
shmily138

shmily138 (作者)

示例代码中静态数据很多超过了一页可以显示完的数量,所以没有出现上述问题,刚测试把数据减少至1条,就会出现不能滑动的情况。

shmily138

shmily138 (作者)

求回复呀

shmily138

shmily138 (作者)

顶一下

DCloud_iOS_XHY

DCloud_iOS_XHY

请提供完整示例工程,方便测试

  • shmily138 (作者)

    已上传示例工程

    2020-10-28 14:15

shmily138

shmily138 (作者)

演示代码

shmily138

shmily138 (作者)

list组件刷新完成会弹到最底部

DCloud_iOS_XHY

DCloud_iOS_XHY

waterfall 组件的用法不对,不要照搬 list 的逻辑,附件是个示例你可以参考一下,具体请查阅uni官方文档

  • shmily138 (作者)

    感谢回复,官方文档内容太少了,我上传的附件中的写法在android中是正常的,我再试试你提供的示例-_-!

    2020-10-28 16:59

  • shmily138 (作者)

    刚使用你提供的示例代码,发现数据少没有填满时,同样有不能刷新和下拉的问题,整个waterfall组件都不能滑动,我和提供的示例工程有相同的问题

    2020-10-28 17:23

  • shmily138 (作者)

    你提供的示例代码中静态数据很多超过了一页可以显示完的数量,所以没有出现上述问题,刚测试把数据减少至1条,就会出现不能滑动的情况。

    2020-10-28 17:25

  • shmily138 (作者)

    回复 DCloud_iOS_XHY: 感谢回复,亲测有效,可以滑动刷新和上拉了。但是有个问题是:在数据已经填满一页时下拉刷新,触发刷新后滚动条会触底导致看不到refresh组件(弹到底部,数据刷新完成后又很快弹到顶部,尝试设置bounce=false会导致不能滑动页面)是什么原因呢?

    2020-10-29 10:13

  • DCloud_iOS_XHY

    回复 shmily138: 这个问题你提供一个简单的示例,录个屏看一下

    2020-10-29 11:47

  • shmily138 (作者)

    回复 DCloud_iOS_XHY: 十分感谢,已经解决这个问题了,控制刷新和加载更多的变量重复使用了。

    2020-10-29 14:13

特购

特购 - 特购

作者怎么解决上拉加载的? 我这边使用loading 标签 不触发@loading事件 我的nvue页面格式是 list-swiper-waterfall 这种格式
loading 写在list里面和waterfall里面都不会触发@loading

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