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;
      }

    },

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM