使用vant组件中van-tabs、van-pull-refresh和van-list时,切换tabs标签,列表重复加载问题。

1 篇文章 0 订阅

问题现象:tabs切换时,如果之前的tab已经滚动到底部,直接点击其他的tab,将再触发一次onload事件。

问题原因:这种情况下,切换tab会导致触发两次请求数据的方法,一次是监听tab切换事件执行的,另一次是由于之前一个tab已经滚动到底部触发的onload事件。
解决措施:设置一个全局变量tabchange,监听到tab切换事件时设置tabchange为true,在onload事件中,只有判断tabchange为false时才请求数据,并且总是设置tabchange为true。
上代码:
//初始化
data(){
	tabchange: false
}
//onload加载事件
onLoad(){
      var that = this
      setTimeout(() => {
        if(!that.tabchange){
          that.getListData()
        }
        that.tabchange=false
      }, 500);
     },
//tab切换事件
changeType(value){
      this.tabchang=true
      //其他更改
    },
  • 2
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 9
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 9
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值