• uni-app 下拉刷新 配置 手动调用 停止下拉刷新


    onPullDownRefresh
    在 js 中定义 onPullDownRefresh 处理函数(和onLaunch,onLoad,onShow等生命周期函数同级),监听当前页面用户下拉刷新事件。

    首先需要在 pages.json 里,找到的当前页面的pages节点,并在 style 选项中开启 enablePullDownRefresh。

    {
        "pages": [
            {
                "path": "pages/index/index",
                "style": {
                    "navigationBarTitleText": "uni-app",
                    "enablePullDownRefresh": true,  //设置为true表示当前页面开启下拉刷新
                    "backgroundTextStyle": "dark"  //下拉 loading 的样式,仅支持 dark/light
                }
            }
        ],
        "globalStyle": {
            "navigationBarTextStyle": "white",
            "navigationBarBackgroundColor": "#0faeff",
            "backgroundColor": "#fbf9fe"
        }
    }
    

      

    • 当处理完数据刷新后,uni.stopPullDownRefresh 可以停止当前页面的下拉刷新。

    uni.startPullDownRefresh(OBJECT)

    开始下拉刷新,调用后触发下拉刷新动画,效果与用户手动下拉刷新一致。(详细参数说明请点击uni.startPullDownRefresh(OBJECT)标题到uniapp官网查看)

     

    uni.startPullDownRefresh(OBJECT)

    在index.vue 停止当前页面下拉刷新

    export default {
        data: {
            text: 'uni-app'
        },
        onLoad: function (options) {
            setTimeout(function () {
                console.log('start pulldown');
            }, 1000);
            //uni.startPullDownRefresh();
            uni.startPullDownRefresh({
                success:function(res){
                    console.log(res);  //success 返回参数说明
                }
            });  //这里表示当进入页面的时候就开始执行下拉刷新动画
        },
        onPullDownRefresh() {
            //监听下拉刷新动作的执行方法,每次手动下拉刷新都会执行一次
            console.log('refresh');
            setTimeout(function () {
                uni.stopPullDownRefresh();  //停止下拉刷新动画
            }, 1000);
        }
    }
    

    更多相关资料可以到uni-app官网查看文档:http://uniapp.dcloud.io/api/ui/pulldown

  • 相关阅读:
    Springboot vue 前后分离 跨域 Activiti6 工作流 集成代码生成器 shiro权限
    mybatis3批量更新 批量插入
    Java GC的工作原理详解
    Hadoop的Map侧join
    cut 命令
    head 与 tail
    常用正则
    vim 设置
    Java泛型初探
    linux修改PS1,自定义命令提示符样式
  • 原文地址:https://www.cnblogs.com/a1847786534/p/14628346.html
Copyright © 2020-2023  润新知