mintui 上拉加载的时候不执行,然后整个页面卡死
1-tab页,么个页面都用到了上拉刷新下拉加载
2-下拉刷新可以实现,但是下拉加载就页面卡死不动,也没有执行下拉加载的函数
<template>
<div ref='PlayerWrap' :style="{ height: (tabPlayer.wrapperHeight-30) + 'px' }" class="member-box">
<mt-loadmore class="news_list" :top-method="loadTopPlayer" :bottom-method="loadBottomPlayer" ref="loadmorePlayer" :bottom-all-loaded="tabPlayer.allLoaded" :autoFill='tabPlayer.autoFill'>
<div class="player-item disFlex flex-wrap" :style="{ height: (wrapperHeight-50) + 'px' }" ref='playerWrap'>
<div class="item disFlex flexCenter flex-colum flex-pack-justify" v-for='(item,index) in playerList' :key='index'>
<div class="item-in">
<div class="top">
<img :src="baseImgUrl + item.avator" alt="" class="avator">
<p class="num">{{ item.number }}</p>
<div class="bond" v-if="item.is_admin =='4'"> <span>c</span> <img src="../assets/images/tournaments/limited_red.png" alt=""> </div>
<div class="bond" v-if='item.is_admin=="2"'> <span>c</span><img src="../assets/images/tournaments/limited_green.png" alt=""></div>
</div>
<div class="bottom size-box">
<p>{{item.name }}</p>
<p>体育主管</p>
</div>
</div>
</div>
data数据:
tabPlayer: {
allLoaded: false,
autoFill: true,
isPull: false,
wrapperHeight: 0,
},
methods 方法:
loadTopPlayer () {
this.firstPlayerloader();
this.$refs.loadmorePlayer.onTopLoaded();
},
loadBottomPlayer () {
this.MorePlayerloader();
this.$refs.loadmorePlayer.onBottomLoaded();
},
firstPlayerloader (id, page = 1, search = '') {
var that = this;
id = this.insId
page = this.page
search = this.playerSearch
filter = this.filter
this.$axios(
this.httpInstitutionUrl + this.afterurl.institutionTeamMember, {
id,
page,
search,
},
'get'
).then((res) => {
if (res.data.code == 0) {
this.playerList = res.data.data.member
this.playerCount = res.data.data.count
localStorage.setItem('playerId', this.playerCount)
this.$nextTick(() => {
if (res.data.data.member.length == 20) {
that.tabPlayer.allLoaded = false;
} else {
that.tabPlayer.allLoaded = true;
}
// that.isPull = true;
this.$refs.loadmorePlayer.onTopLoaded();
});
}
}).catch((err) => {
console.log(err);
})
},
// 加载更多
MorePlayerloader (id, page = 1, search = '', filter) {
console.log(111); //不执行
var that = this;
id = this.insId
search = this.playerSearch
page = this.page
filter = this.filter
this.$axios(
this.httpInstitutionUrl + this.afterurl.institutionTeamMember, {
id,
page,
search,
filter,
},
'get'
).then((res) => {
if (res.data.code == 0) {
let data = this.playerList
data.push(...res.data.data.member)
this.playerList = data
console.log('more', this.playerList);
// 数据渲染成功后,隐藏下拉刷新的状态
this.$nextTick(() => {
if (res.data.data.member.length == 20) {
that.tabPlayer.allLoaded = false;
this.page = this.page + 1;
} else {
that.tabPlayer.allLoaded = true
this.$refs.loadmorePlayer.onBottomLoaded();
}
that.isPull = false;
});
}
}).catch((err) => {
console.log(err);
})
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论