vant实现下拉刷新和上拉加载_记一次 vant-list 下拉加载和下拉刷新

export default{

data(){

return {

list:[],

page:0,//分页总数

number:0,//分页数

loading:false,//控制载入动画

finished:false,//是否再执行 onLoad方法

isLoading:false,//控制下拉重新载入

}

},

methods:{

init(){

let self = this;

let data = {

number : ++self.number

};

axios.get("/get/list", data, re=>{

self.list = re.info.list;

self.page = re.info.page;

self.isLoading = false;

});

},

onRefresh(){

let self = this;

setTimeout(() => {

self.page = 0;

self.init();//加载

},500);

},

onLoad() {

let self = this;

let data = {

page: ++self.number,

};

setTimeout(() => {

axios.get("get/list", {

data,

success: function(re) {

self.page = re.page;

self.list = self.list.concat(re.info.list);//追加数据

self.loading = false; //加载状态结束

// 数据全部加载完成

if (self.totalPage <= self.pageNumber) {

self.finished = true;

}

}

});

}, 500);

}

}

}