凯里网站建设流程,成都网站设计哪家好,中国建设行业网站,北京网站制作设计公司排名如图#xff1a; 使用uniapp内置方法 onPageScroll 获取到滚动了多少。
其实拿到屏幕滚动多少就很简单了#xff0c;下面是思路。
tap栏切换效果代码就不贴了。直接贴如何到那个模块定位到哪#xff0c;和点击定位到当前模块。 view v-ifshow class 使用uniapp内置方法 onPageScroll 获取到滚动了多少。
其实拿到屏幕滚动多少就很简单了下面是思路。
tap栏切换效果代码就不贴了。直接贴如何到那个模块定位到哪和点击定位到当前模块。 view v-ifshow classtab-box view classoverflowView view classtab-item clicktestTabClick(index) :classtabIndex index?active: v-for(item,index) in tabList :keyindex {{item.name}} /view /view /view onPageScroll(res) { let scrollTopone 650 let scrollToper 1150 let scrollTopthree 1550 let scrollTopfour 1750 let scrollTopfive 1850 console.log(res.scrollTop); 这样判断的意思是多少到多少之间滚动到相应的位置高亮对应tap栏。 if (res.scrollTop 300 res.scrollTop scrollTopone) { this.tabIndex 1 }else if (res.scrollTop 650 res.scrollTop scrollToper) { this.tabIndex 2 }else if (res.scrollTop 1150 res.scrollTop scrollTopthree) { this.tabIndex 3 }else if (res.scrollTop 1550 res.scrollTop scrollTopfour) { this.tabIndex 4 }else if (res.scrollTop 1750 res.scrollTop scrollTopfive) { this.tabIndex 5 }else { this.tabIndex 6 } if (res.scrollTop 300) { this.show true }else if (res.scrollTop 300 ) { this.show false } }, 点击那个模块定位到当前模块。 testTabClick(index) { if (index 0) { document.documentElement.scrollTop 0 }else if (index 1) { document.documentElement.scrollTop 300 }else if (index 2) { document.documentElement.scrollTop 650 }else if (index 3) { document.documentElement.scrollTop 1150 }else if (index 4) { document.documentElement.scrollTop 1550 }else if (index 5) { document.documentElement.scrollTop 1750 }else if (index 6) { document.documentElement.scrollTop 2000 } this.tabIndex index console.log(this.tabIndex); },