ElemeFE/vue-infinite-scroll

使用vue-infinite-scroll插件,页面拉到底部不会触发v-infinite-scroll="loadMore"绑定的loadMore方法

Opened this issue · 1 comments

<div class="list-box" v-infinite-scroll="loadingMore" infinite-scroll-disabled="busy" infinite-scroll-distance="0"> <ul class="list" v-show="type=='xiangkan'"> <li v-for="item in xiangkanList" @click="goXiangkanDetail(item.id)"> <message-item :item="item"></message-item> </li> </ul> <ul class="list" v-show="type=='counselor'"> <li v-for="item in counselorList" @click="goCounselorIndex(item.wx_userid)"> <counselor-item :item="item"></counselor-item> </li> </ul> </div>

data(){ return{ swipes:{ activeIndex:0, //banner默认位置 imgs:[], //banner图地址 }, loading:false, //是否显示加载动画 topicList:[], //专题推荐数据 newsList:[], //行业热点数据 xiangkanList:[], //热门提问 counselorList:[], //顾问列表 type:'xiangkan', //标记当前是显示热门提问还是顾问列表 getData:false, //标记是否加载完数据 scrollY:0, //记录页面离开的位置 busy: false, //是否允许无限加载,true为禁止 showLoadMore: false, //是否显示加载更多动画 } },

loadMore(){ console.log('loadmore'); alert('loadingmore'); this.showLoadMore = true; this.busy = true; if(this.type == 'xiangkan'){ this.loadList(this.xiangkanList.length).then(res=>{ this.xiangkanList = this.xiangkanList.concat(res.data.data.list); this.showLoadMore = false; this.busy = false; }) }else if(this.type == 'counselor'){ this.loadCounselor(this.counselorList.length).then(res=>{ this.counselorList = this.counselorList.concat(res.data.data.list); this.showLoadMore = false; this.busy = false; }) } }

import infiniteScroll from 'vue-infinite-scroll'; import * as Const from './const/config'; var weixin = require('./utils/weixin'); Vue.use(http,'$http'); Vue.use(infiniteScroll);

有人回答这个问题吗?我也遇到了,之前测试是好的,但不知道为什么突然就出问题了