孤卷残梦饮一池恨 2020-11-20 11:27 采纳率: 80%
浏览 909
已结题

微信小程序实现上下滑动tabs样式切换

如何实现像微信小程序【粤省事】的上下滑动切换tabs的效果,点击切换内容的效果,需要详细的代码效果,我目前可以做到滑动样式切换,但点击后有一点问题  

//点击切换内容
	handleTabClick: function (event) {
		this.setData({
			currentTab: event.currentTarget.dataset.current
		});
	},

// 上下滑动切换
	slideSwitch() {
		let _this=this
		console.log("+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++")
		slide_switch=	wx.createIntersectionObserver(_this, 
			 {
				// thresholds:[0.05,0.2],initialRatio:0.5,
			observeAll: true
		})
		slide_switch.relativeTo('.line_line',{bottom:7})
		slide_switch.relativeToViewport()
		slide_switch.observe('.commonly-item', (res) => {
			console.log("相交值before:"+this.data.activeTab, res)
			// if (res.intersectionRatio > 0) {
				_this.setData({
					activeTab:  res.dataset.index,
			})
			console.log("相交值after:"+this.data.activeTab)
			// }
		})
	},
	
  • 写回答

2条回答 默认 最新

  • Rattenking Python领域优质创作者 2020-11-26 14:12
    关注

    colorUI有这个效果,直接参考他的源码,不难!

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 3月29日
  • 已采纳回答 3月21日

悬赏问题

  • ¥20 求文心中文心理分析系统(TextMind)
  • ¥15 chipyard环境搭建问题
  • ¥15 python,pyopenGL的OBV渲染无法设置透明
  • ¥20 matlab可以把多个二维图合成为三维瀑布图吗
  • ¥15 EEPROM,软件i2c
  • ¥500 求解读该段JS代码,需要知道是用干什么的
  • ¥20 qt4代码实现二进制文件读取显示,以及显示的内容进行搜索
  • ¥15 Labview获取LK-G3001数据
  • ¥15 我知道什么是混合树,但是怎么写代码啊
  • ¥50 开发板linux系统安装dpkg,apt函数库 有偿