MUI结合Vue实现上拉下拉加载

直接上代码~
网页：

<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
		<div class="mui-scroll"  >
			<ul class="mui-table-view" id="vue">
				<div class="noTip" v-show="arrayList.length==0">暂无记录~</div>
				<li v-for="item in arrayList" class="mui-table-view-cell mui-media" @click="goDetail(item.wasteNum)">
					<div  class="mui-pull-right img_box">
						<img :src="item.wastePhoto" />
					</div>
					<div class="mui-media-body">
						<p class="mui-ellipsis">废弃物编号:{{item.wasteNum}}</p>
						<p class="mui-ellipsis">废弃物来源：{{item.hospitalName}}</p>

						<p class="mui-ellipsis">打包日期：{{item.wastePackTime}}</p>
					</div>
				</li>
			</ul>
		</div>
	</div>

JavScript：

		mui("#pullrefresh").on('tap', 'li', function (event) {
            this.click();
        }); //这个是为了解决mui-scroll中绑定vue点击事件无效
        mui.init({
            pullRefresh: {
                container: '#pullrefresh',
                down: {
                    style:'circle',
                    callback: pulldownRefresh
                },
                up: {
                    contentrefresh: '正在加载...',
                    callback: pullupRefresh
                }
            }

        });


		/**
         * 下拉刷新具体业务实现
         */
        function pulldownRefresh() {
            setTimeout(function() {
                var data= {
                    "type":"1", //上拉请求
                    "pageNo":"0",
                    "wasteState":wasteStat
                }
                var success=function(data){
                    if(data.code==1){
                        vue.arrayList = data.result;
                    }else{
                        mui.toast(data.message)
                    }
                    //			return callback();
                }
                var error = function(xhr,type,errorThrown){
                    //异常处理；
                    console.log(type);
                }
                app.myajax("appWeb/listWaste",app.getToken(),data,'post',success,error);
                mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
                mui.toast('下拉刷新成功');
            }, 1000);
        }

        var pageNo = 0;  //页数
        /**
         * 上拉加载具体业务实现
         */
        var flag=0; //是否无数据
        function pullupRefresh() {
            if(flag==1){
                mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);//参数为true代表没有更多数据了
                return;
            }
            
            setTimeout(function() {
                var data= {
                    "type":"2", //下拉加载更多
                    "pageNo":(++pageNo).toString(),
                    "wasteState":wasteStat
                }
                var success=function(data){
                    if(data.code==1){
                        vue.arrayList= vue.arrayList.concat(data.result); //将获取的json数组和当前的进行拼接
                        if(data.result.length<10) { //如果返回数据不足10条，后台Limit为10，即表示没有更多数据
                            flag = 1
                        }
                        mui('#pullrefresh').pullRefresh().endPullupToRefresh();
                    }else{
                        mui.toast(data.message)
                    }
                    //			return callback();
                }
                var error = function(xhr,type,errorThrown){
                    //异常处理；
                    console.log(type);
                }
                app.myajax("appWeb/listWaste",app.getToken(),data,'post',success,error);
            }, 1000);
        }