安卓下下拉刷新无效,ios下上拉加载也不正常

分类：MUI

下拉刷新

<!doctype html>  
<html>  

    <head>  
        <meta charset="UTF-8">  
        <title></title>  
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />  
        <link href="css/mui.min.css" rel="stylesheet" />  
        <link rel="stylesheet" href="css/iconfont.css" />  

        <style type="text/css">  
            .mui-table-view-cell:after {  
                height: 0 !important;  
            }  

            .mui-table-view img {  
                width: 100%;  
                /*height: 170px !important;*/  
                border: 1px solid #8F8F94;  
            }             
            .mui-media-body {  
                text-align: center;  
                margin-top: 10px;  
            }  

        </style>  
    </head>  

    <body>  
        <div class="mui-content">  
            <div class="pullrefresh">  
                <div class="mui-scroll">  
                    <ul class="mui-table-view mui-grid-view" id="list">  
                        <li v-on:click="opendetail(index)" class="mui-table-view-cell mui-media mui-col-xs-6" v-for="(item,index) in companylist">  
                            <img class="mui-media-object" v-bind:src="item.smeta">  
                            <div class="mui-media-body">  
                                {{item.post_title}}  
                            </div>  
                        </li>  
                    </ul>  
                </div>  
            </div>  
        </div>  
        <script src="js/mui.min.js"></script>  
        <script src="https://unpkg.com/vue@2.1.4/dist/vue.js"></script>  
        <script type="text/javascript">  
            mui.init({  
                pullRefresh: {  
                    container: ".pullrefresh", //待刷新区域标识，querySelector能定位的css选择器均可，比如：id、.class等  
                    down: { //下拉刷新  
                        auto: true, //可选,默认false.自动下拉刷新一次  
                        contentdown: "下拉可以刷新", //可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容  
                        contentover: "释放立即刷新", //可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容  
                        contentrefresh: "正在刷新...", //可选，正在刷新状态时，下拉刷新控件上显示的标题内容  
                        callback: pulldownRefresh  
                    },  
                    up: {  
                        height: 50, //可选.默认50.触发上拉加载拖动距离  
                        auto: false, //可选,默认false.自动上拉加载一次  
                        contentrefresh: "正在加载...", //可选，正在加载状态时，上拉加载控件上显示的标题内容  
                        contentnomore: '没有更多数据了', //可选，请求完毕若没有更多数据时显示的提醒内容；  
                        callback: pullfresh  
                    }  
                }  
            });  

            function pulldownRefresh() {  
                setTimeout(function() {  
                    count = 0; //刷新并显示第一页  
                    data = {  
                        //...,  
                        page: count  
                    };  
                    type = 1; //代表下拉刷新  
                    toList(data, type); //具体取数据的方法  
                }, 100);  
            }  

            function pullfresh() {  
                setTimeout(function() {  
                    count++  
                    data = {  
                        page: count  
                    };  
                    type = 2; //代表上拉加载  
                    toList(data, type); //具体取数据的方法  

                }, 100);  
            }  
            var vm = new Vue({ //此处采用vue.js  
                el: '#list',  
                data: {  
                    companylist: null,  
                },  
                created: function() {},  
                methods: {  
                    opendetail: function(index) {  
                        console.log(this.companylist[index].tid)  
                        mui.openWindow({  
                            url: 'details-mudi.html',  
                            extras: {  
                                tid: this.companylist[index].tid  
                            }  

                        })  
                    }  
                }  
            });  
            var toList = function(data, type) {  
                var sid = plus.storage.getItem("sid");  

                mui.ajax("http://10.0.0.103/index.php/group/Listone/graveyard", {  
                    data: data,  
                    dataType: 'json',  
                    type: 'POST',  
                    timeout: 10000,  
                    headers: {'Cookie':"JSESSIONID="+sid},  
                    success: function(data) {  
                            console.log(data)  
                            if(data.code == 0) {  
                                alert("请登录")  
                                mui.openWindow({  
                                    url: 'login.html',  
                                    id: 'login.html'  
                                });  
                            }  
                            for(var i in data.data) {  
                                var arr = new Array();  
                                for(var item in data.data[i]) {  
                                    arr[item] = data.data[i][item];  
                                }  
                                if(type == 1) {   
                                    mui('.pullrefresh').pullRefresh().refresh(true);   
                                    vm.companylist = data.data;  
                                }  
                                if(type == 2) {   

                                    vm.companylist.push(arr);  
                                    console.log(vm.companylist)  
                                }  
                            }  
                            mui('.pullrefresh').pullRefresh().endPulldownToRefresh();  

                            if(data.status == 1) {  
                                mui('.pullrefresh').pullRefresh().endPullupToRefresh(false);  
                            } else {  
                                mui('.pullrefresh').pullRefresh().endPullupToRefresh(true);  
                            }  
                        }  

                });  
            }  
        </script>  
    </body>  

</html>

2017-02-13 23:46 负责人:无分享