<!--下拉刷新容器-->
<div id="Movies-scroll-box" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<!--数据列表-->
<ul id="movies" class="mui-table-view mui-table-view-chevron media-box">
<li class="mui-table-view-cell mui-media" v-for="item in movies">
<a href="javascript:;">
<img class="mui-pull-left" :src="item.imgs">
<div class="mui-media-body">
<h2>{{item.title}}</h2>
<p><label class="meia-type">{{item.genres}}</label>
<label v-if="item.rating>0" class="media-grade">{{item.rating}}分</label>
<label v-else class="media-grade">暂无评分</label>
</p>
<p class="mui-ellipsis">导演:<label class="media-dy">{{item.directors}}</label></p>
<p class="mui-ellipsis">主演:<label class="media-zy">{{item.casts}}</label></p>
</div>
</a>
</li>
</ul>
</div>
</div>
JS部分
mui.init({
pullRefresh: {
container: '#Movies-scroll-box',
down: {
style:'circle',
callback: pulldownRefresh
},
up: {
contentrefresh: '正在加载...',
callback: pullupRefresh
}
}
});
//初始化滚动区域
mui('#Movies-scroll-box').scroll({
indicators: false, //是否显示滚动条
});
//获取数据
mui.ajax({
type:'get',
url:'',
dataType:'jsonp',
success:function(data){
var data=JSON.parse(data)
var moviesdata=ResData(data.subjects)
//console.log(moviesdata)
mediaData.movies=moviesdata;
}
})
//下拉刷新
function pulldownRefresh(){
//获取电影
mui.ajax({
type:'get',
url:'',
data:{
start:0,
count:20
},
dataType:'jsonp',
success:function(data){
//清空现在的数组
mediaData.movies.splice(0,mediaData.movies.length);
var data=JSON.parse(data)
var moviesdata=ResData(data.subjects)
//console.log(moviesdata)
mediaData.movies=mediaData.movies.concat(moviesdata);
//结束下拉刷新
mui('#Movies-scroll-box').pullRefresh().endPulldownToRefresh()
}
})
}
//上拉加载
function pullupRefresh(){
//获取电影
mui.ajax({
type:'get',
url:'',
data:{
start:mediaData.movies.length,
count:20
},
dataType:'jsonp',
success:function(data){
mui('#Movies-scroll-box').pullRefresh().endPullupToRefresh(mediaData.movies.length>data.total)
var data=JSON.parse(data)
var moviesdata=ResData(data.subjects)
//console.log(moviesdata)
mediaData.movies=mediaData.movies.concat(moviesdata);
}
})
}
1 个回复
blueSky235
我也是这个,你解决了没