碰到的问题是如果将孙子组件单独拿出来是能滚动加载数据的,但是如果父组件存在切换的tab,子组件也存在tab切换,子组件就无法滚动加载数据
示意图
代码结构
刚开始的处理思路
在子组件中使用滚动加载,但是无法触发事件,另在测试的时候,发现只是触发了父级的滚动加载事件.就想到了利用父级的滚动加载事件和tab切换事件协调统一起来,通过父级事件调用子组件的滚动加载
优化过的思路
父组件调用子组件的滚动加载事件
onReachBottom(){
this.$broadcast('reOnReachBottom')
}
子组件事件
events={
reOnReachBottom(){
let {list, listTotal} = this;
if(list.length < listTotal){
this.params.pageNo += 1;
this.$apply();
this.getDtl().then(res => {
this.ordDtllCB(res);
});
}
},
}
另中间测试的过程中还碰到过白痴的问题,滚动加载是触底才出发,数据条数为1条的分页条件时,item没有达到触底的条件,所以不会触发 ?