欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  互联网

解决scroll-view在微信小程序和uni-app下拉刷新后刷新条无法正常恢复的问题

程序员文章站 2022-03-04 14:38:03
关于scroll-view,在Uni-app和小程序中 refresher-triggered="{{triggered}}" bindrefresherpulling="onPulling" bindrefresherrefresh="onRefresh" bindrefresherrestore="onRestore"1.不管triggered为何值,在界面中下拉,都会触发onRefresh,但不会自动改变triggered值(不能双向绑定,这是问题的...

关于scroll-view,在Uni-app和小程序中

      refresher-triggered="{{triggered}}"
      bindrefresherpulling="onPulling"
      bindrefresherrefresh="onRefresh"
      bindrefresherrestore="onRestore"

1.不管triggered为何值,在界面中下拉,都会触发onRefresh,但不会自动改变triggered值(不能双向绑定,这是问题的根本原因);
2.onRefresh执行完毕,不会自动触发onRestore(复位)(这是问题的表现),使得刷新图标一直显示,必须是triggered由true变为false,才会触发onRestore并隐藏刷新图标;

所以我们在执行onRefresh的时候需要判断是否在刷新中,是的话,就不执行刷新,直接return,否的话,就执行刷新方法,将triggered值设置为true!!!
最后定时调度,再将triggerde设置为false,然后这个就会在刷新后,自己调用onRestore自己复位了,代码如下

自己先定义Isfreshing=false
onRefresh() { 
        if (this.Isfreshing) return;  
        this.Isfreshing = true;  
        if (!this.triggered)//保证刷新状态下,triggered为true  
            this.triggered = true;  
        setTimeout(() => {  
            this.triggered = false;//触发onRestore,关闭刷新图标  
            this.Isfreshing = false;  
        }, 1200)  
      },
      },

遇到微信小程序开发的问题,大部分的原因可能都是由于无法双向绑定造成的,遇见一般小一些的问题,所以多考虑自己写函数方法去尝试解决值的变动。

本文地址:https://blog.csdn.net/weixin_43722571/article/details/112554726

相关标签: 移动端 小程序