vue 解决滚动与下拉刷新冲突
1.思路
监听滚动条与顶部的距离,当距离不为0时,禁用下拉刷新。即滚动条在顶部时启用下拉刷新,不在顶部禁用下拉刷新。
2.代码实现
<van-pull-refresh style="height:100%" v-model="isLoading" @refresh="onRefresh" :disabled="refDisabled" > <van-tabs v-model="active"> <van-tab title="xxx"> <div class="carspace_con" id="carspace_con" ref="Box" @scroll="divScroll"> </div> </van-tab> <van-tab title="yyy"> </van-tab> </van-tabs> </van-pull-refresh>
divScroll(e){ let toTop = this.$refs.Box.scrollTop; //console.log('距离顶部'+toTop); if(toTop==0){ this.refDisabled=false } else{ this.refDisabled=true; } },