又不能把整个页面的橡皮筋效果给禁掉。
xdrfv
- 发布：2023-07-10 16:33
- 更新：2023-07-10 17:53
- 阅读：493
字多不看，既然热得煎鸡蛋了，干脆搞个活动，安装app送鸡蛋
pages.json disableScroll:true 解千愁
如果觉得是这个的问题，为了头发，可以直接干掉就行了，使用区域滚动，scroll-view，监听就行了
你如果要做吸顶，scroll-view内容用一个view包裹，内容部分需要吸顶的，直接写postion:sticky就行了
爱豆豆 - 办法总比困难多
回弹效果发烫? 能贴一下代码片段吗？
-
xdrfv (作者)
非常感谢询问！
// 滚动监听赋值
onPageScroll(e) {
// 如果有分界线，且顶部选项卡显示，且当前滚动高度小于分界线
if (this.fixedScrollTop !== 0 && this.showTopTab && e.scrollTop < this.fixedScrollTop) {
// 取消显示，scroll回到顶部
console.log('hiddenTopTab');
this.showTopTab = false;
this.goTop(0);
}
// 如果有分界线，且当前滚动高度大于分界线，显示选项卡（此处不能再判断选项卡显隐，滚动条回弹会有问题）
if (this.fixedScrollTop !== 0 && e.scrollTop >= this.fixedScrollTop - 30) {
console.log('showTopTab');
this.scrollY = true;
this.showTopTab = true;
}
// 如果还未有分界线，但是已经显示顶部了，记录分界线
if (this.fixedScrollTop === 0 && this.showTopTab) {
console.log('markTopTab');
// 苹果则不改变分界线
if (this.platform === 'ios') {
// this.fixedScrollTop = e.scrollTop - 44
} else {
this.fixedScrollTop = e.scrollTop;
console.log('hasMarkShowTop', this.fixedScrollTop, e.scrollTop);
}
}
},
业务场景是选项卡吸顶，内容页能左右滑动。安卓完全不会发烫，但是苹果一会儿就烫起来了，他们的区别就只有橡皮筋回弹效果。2023-07-10 16:51
-
xdrfv (作者)
// 触底时显示选项卡，安卓需要
onReachBottom() {
// 如果是苹果不同过此方法控制显隐
if (this.platform === 'ios') {
return null;
}
// 安卓：触底显示选项卡，可滑动
if (!this.showTopTab) {
console.log('toBottom');
this.showTopTab = true;
this.scrollY = true;
}
},还有这块2023-07-10 16:52
-
-
-
-
-
-
xdrfv (作者)
这个代码是要实现，选项卡能吸顶，且能左右滑动切换。
实现方式是sticky布局选项卡，再swiper嵌套定高scroll-view。
但是里层的scroll-view在还未到达顶部时，内部要不可滑动 ，因此虽然有sticky但还是得判断是否触顶。
触顶条件原本是onreachbottom，触底时记录当前scrollTop高度，结果ios的回弹才是天坑，滑到底部的时候回弹了，外部滚动条的scrollTop跳来跳去，根本没法子判断触顶值，后来只能用定值判断（所以我认为是监听滚动条回弹导致的发热）。（而且这种方式判断内部是否可滑动，设scroll值时会有延迟，差的手机还会卡一下，就很头秃）
我不确定再在外层套个scroll-view可不可行，之前看垂直方向不能套，能套吗？
2023-07-10 18:09
勇哥萌萌哒
回复 xdrfv: 不建议这么套，你垂直方向上的滚动只需要一个scroll-view就行了，就是保持你swiper-item内部的scroll-view, 最外层不写scroll-view，这样做只是取消了回弹，其它照旧
2023-07-11 14:57
勇哥萌萌哒
回复 xdrfv: onreachbottom监听改为用 scrolltolower监听，另外scroll-view的内容使用view标签包裹一下，你触顶就不需要额外判断了，优化一下布局能解决很多问题
2023-07-11 15:05
xdrfv (作者)
回复 勇哥萌萌哒: 原来的代码就只有swiper内部的scroll-view，以及用 scrolltolower监听是无意义的，因为这个功能很重要一点就是“在选项卡还未到达顶部时，scroll-view不能滑动”，因此无法使用监听内部触底。
我在尝试直接不用scroll-view，但是顶部区域用了一堆子组件，获取高度真的头疼。
2023-07-17 10:31