request_html下拉刷新,小程序--上滑加载更多数据/下拉刷新

一、上滑加中比需抖接朋功要朋插载更多数据

wxml;

js    遇新是直朋能到

// wx.showNavigationBarLoading()组件var app = getApp()

var util = require('../../../utils/util.js')

Page({

data: {

navigateTitle: "", //设置中间变量 把onload中的获取到的标题函数传入到onReady中使用

requestUrl: "",

totalCount: 0,

isEmpty: true //是否是第一次加载

},

onLoad: function (options) {

var category = options.category;//获取url传递的参数

var dataUrl = "";//记录此时加载的url的值 用于滑动加载

this.data.navigateTitle = category;

//加载数据

var dataUrl = "";

switch (category) {

case "正在热映":

dataUrl = app.globalData.doubanBase +

"/v2/movie/in_theaters";

break;

case "即将上映":

dataUrl = app.globalData.doubanBase +

"/v2/movie/coming_soon";

break;

case "豆瓣Top250":

dataUrl = app.globalData.doubanBase + "/v2/movie/top250"; //默认是star =0 &count=20

break;

}

wx.setNavigationBarTitle({

title: this.data.navigateTitle

})

this.data.requestUrl = dataUrl;

util.http(dataUrl, this.processDoubanData);

},

//数据处理

processDoubanData: function (moviesDouban) {

var movies = [];

for (var idx in moviesDouban.subjects) {

var subject = moviesDouban.subjects[idx];

var title = subject.title;

if (title.length >= 6) {

title = title.substring(0, 6) + "...";

}

// [1,1,1,1,1] [1,1,1,0,0]

var temp = {

stars: util.convertToStarsArray(subject.rating.stars),

title: title,

average: subject.rating.average,

coverageUrl: subject.images.large,

movieId: subject.id

}

movies.push(temp)

}

//每次数据绑定之前 totalCount做一次累加

//加载更多 jq是加载append的思想 但是小程序没有dom 整体思路:第一次是20条数据 第二次是40条 数据绑定每次都setdata

//每次加载都需要数据更新一下

var totalMovies = {}

//如果要绑定新加载的数据,那么需要同旧有的数据合并在一起

if (!this.data.isEmpty) {

totalMovies = this.data.movies.concat(movies);

}

else {

totalMovies = movies;

this.data.isEmpty = false;

}

this.setData({

movies:totalMovies

})

this.data.totalCount += 20;

},

callBack:function(data){

console.log(data);

},

//上滑加载更多函数 使用竖向滚动时,需要给一个固定高度,通过 WXSS 设置 height。

onScrollLower: function (event) {

//上滑动加载 变化的是加载数据的序号初始1-20 再次上滑加载20-40 star= &count= 由于后台接口没有那么多数据看不到效果

//设定要加载的url

var nextUrl = this.data.requestUrl + "?start=" + this.data.totalCount +"&count=20"

//获取数据

util.http(nextUrl, this.processDoubanData);

},

onReady: function (event) {

wx.setNavigationBarTitle({

title: this.data.navigateTitle

})

}

})

二、下拉刷新

1、使我自址哈这工边识框处己按后大都加控不架的用单页的jso比抖朋要插支一圈不者地器享说几n文件配置

{

"enablePullDownRefresh": true

}

2、APP朋不功事做时次功好来多这开制的请一例农在.json window配是能览调不页新代些事几求事都时学下是事置

"window": {

"enablePullDownRefresh": true

},

3、js

enablePullDownRefresh会触发函数

onPullDownRefresh//上拉刷新

onPullDownRefresh:function(event){

console.log('下拉刷新');

var refreshUrl = this.data.requestUrl +

"?star=0&count=20";

this.data.movies = {};

this.data.isEmpty = true;

this.data.totalCount = 0;

util.http(refreshUrl, this.processDoubanData);

wx.showNavigationBarLoading();

},

本文来源于网络:查看 >https://blog.csdn.net/lsy__lsy/article/details/80507184