小程序 Vant Weapp 使用van-tabs控制切换tab请求后台频率

这里写微信小程序代码,使用的vant组件库,然后想控制频繁的切换tab让后台发送请求的评论,这里实际是二级目录,但是和一级tabs的关系不大,所以不展示了,只需要知道这是一层就好了

下面是wxml代码:

	<van-tabs type="card" style="margin-top: 10rpx;" active="{{ activeTab }}" bind:change="handleTabChange">

		<van-tab title="我抽到的纸条" bind:tap="loadData1"></van-tab>

		<van-tab title="我放入的纸条" bind:tap="loadData2">内容 2</van-tab>

	</van-tabs>

 通过主tabs绑定事件handleTabChange来控制,需要再data里面定义上次接口调用的时间,和选中的标签,来记录时间和加载默认选中项

data数据:

data:{
    activeTab: 0, // 默认选中我的纸条的tab  
	lastLoadTime01: 0, // 我的抽到纸条上一次加载数据的时间  
	lastLoadTime02: 0, // 我的放入纸条上一次加载数据的时间  
}

加载默认选中项和切换保存默认加载

这样在其他页面切换回来还会加载之前选中的二级tab

handleOuterTabTap(){
	    // 根据activeTab来判断应该调用哪个方法
		if (this.data.activeTab === 0) {
			this.loadData1();
		} else if (this.data.activeTab === 1) {
			this.loadData2();
		}
	},
handleTabChange(e) {
	    // 更新activeTab
		this.setData({
		   activeTab: e.detail.index
		});
	}

加载选择数据

    loadData1: function() {
		// 检查上一次加载数据的时间
		var currentTime = new Date().getTime();
		if (currentTime - this.data.lastLoadTime02 < 5000) {
			// 如果距离上一次加载数据的时间小于5秒,就不加载数据
			return;
		}
		console.log('调用loadData1')
		// 更新lastLoadTime
		this.setData({
			lastLoadTime02: currentTime
		});
	},
	loadData2: function() {
		// 检查上一次加载数据的时间
		var currentTime = new Date().getTime();
		if (currentTime - this.data.lastLoadTime01 < 5000) {
			// 如果距离上一次加载数据的时间小于5秒,就不加载数据
			return;
		}
		console.log('调用loadData2')
		// 更新lastLoadTime
		this.setData({
			lastLoadTime01: currentTime
		});
	},

 我这里频繁的切换二级目录几十次

 但是实际接口调用次数只有四次

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值