• 关于mui中一个页面有有多个页签进行切换的下拉刷新加搜索问题


    此图是最近做的项目中的一页,用的是mui结合vue,用了mui后,觉得是真心难用啊,先不说其他的,就光这个下拉刷新就让人奔溃了,问题层出不穷,不过最后经过努力还是摆平了哈。
    clipboard.png

    1.每次切换到新的标签,都应该重置一下下拉刷新

    toTop(){
                var scroll= mui('#refreshContainer').scroll();
                this.scroll.scrollTo(0,0,0)
                that.currenSize=0
                this.page=1
                mui("#refreshContainer").pullRefresh().refresh(true);
            },

    2.调用列表的方法

    getFoucus(focus,p){
               this.current=focus
               this.page=p
              if(this.page==1){
                    this.toTop()
                }
                this.axios.post(this.api + "/project/projectList/getMyFocusOn",$.param({"itcode":this.userMessage.entityCode,'page':this.page,"pageSize":this.pageSize}))
                .then(res => {
                    var result = res.data;
                    if (result.status == 0) {
                        this.requesting=false;
                        if(result.status==0){
                                this.requesting=false;
                                if(this.page==1){
                                this.projectList=result.page.list;
                                }else{
                                    var lists=result.page.list
                                    this.projectList=this.projectList.concat(lists)
                                }
                                this.title=$(".mui-active").html()
                                this.currenSize+=this.pageSize
                                this.total=result.page.total
                        } else {
                            mui.toast(result.message)
                        }
                    }
                })
            },

    3.下拉执行的方法

    pullRefresh(){
                var vm=this;
                mui("#refreshContainer").pullRefresh({
                    up:{
                        contentrefresh : "正在加载...",//可选,正在加载状态时,上拉加载控件上显示的标题内容
                        contentnomore:'没有更多数据了',//可选,请求完毕若没有更多数据时显示的提醒内容;
                        callback:function(){//必选,刷新函数,根据具体业务来编写,比如通过ajax从服务器获取新数据;
                            setTimeout(()=>{
                                vm.page++
                                if(vm.currenSize>=vm.total){
                                    mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
                                }else{
                                    vm.getFoucus(vm.current,vm.page)
                                }
                                this.endPullupToRefresh(false)
                            },300);
                        },
                    },
                })
            },
  • 相关阅读:
    python函数
    文件操作
    python列表,元组,字典,集合简介
    python字符串(str)
    python数字类型 or 进制转换
    流程控制
    Python入门
    Python垃圾回收机制
    python简介&下载&安装
    DAY11
  • 原文地址:https://www.cnblogs.com/10manongit/p/12831880.html
Copyright © 2020-2023  润新知