小程序的 scroll-view 滚动和页面滚动之间的传递

[gaigechunfeng]

在用 uniapp 开发的小程序的时候，遇到一个问题，就是上下滑动的 scroll-view 和页面滑动不能相互传递。

我的页面布局可简单描述为：上是 header，中是 tabbar，下是一个 swiper 包含的 scroll-view （可上下滑动）

为了达到向上滑动一定距离后 tabbar 吸顶的效果，我是这么做的： 1、一开始 scroll-view 禁止上下滑动，此时是页面滑动效果； 2、等到 tabbar 的 top 为 0 时，变成 fiexd，然后 打开 scroll 的滑动；

这样是可以实现这种效果，但是由于页面滑动和 scroll-view 不能传递滑动，所以在手机上，惯性滑动的时候，总是会中断。

（为什么要用 scroll-view 和 swiper 呢，是因为我还想左右滑动切换 swiper。否则就可以不用 scroll-view 了。 直接使用页面滑动，是很流畅的）

大家有什么好的解决办法吗？？

[functionjx]

我也遇到和你一眼的问题，解决后我再回来教你哈哈。

[gaigechunfeng]

@functionjx 哇靠哇靠，不知道是大家没遇到这个需求，还是我描述的不清楚，都没人回复我，还是你懂我！！

我好像用一个不太完美的方法实现了这个需求，当然你有更好的解决办法可以一起分享下。

握手～回头咱俩交流一下。

[gaigechunfeng]

@functionjx 兄弟解决了吗？哈哈

[15866]

@gaigechunfeng 兄弟你用什么办法解决的啊

[15866]

@functionjx 兄弟你咋解决这个问题的啊

[gaigechunfeng]

@15866 哈哈你居然能搜到我这个贴子里面来。说明两件事：
1 、你遇到了和我一样的疑惑，我以为我说的大家都不明白呢；
2 、网上确实没有这个解决方法；

这个我最后是规避掉了。就是不用 scrollview 了，还用普通的 view 就可以传动了。
贴一下最简单的标签给你。

<swiper class="tab-content" :current="currentTabIndex" duration="300" @change="switchTab" :style="{height:winHeight+'px'}">
<swiper-item v-for="(item,index) in tabbar" :key="index">
<!-- 内容 start -->
<view class="tui-product-box" id="mylist">

[15866]

@gaigechunfeng view 带 overflow: scroll 吗？我这边使用 view 带 overflow: scroll 还是无法传递滚动。

[15866]

@gaigechunfeng 这个问题在 iOS 上是尤为明显的，在滚动过程中，只要用户不松手，页面滚动的和 swiper 内（内嵌的 view 或者 scroll-view ）的滚动就无法完成传递。

我看在斑马英语小程序上也有类似的功能，不知道他们采用了什么样的方法，在页面滚动到 tabbar 置顶位置时，会强制禁掉页面的滚动，迫使用户中断滑动操作并松手。

[gaigechunfeng]

@15866 我是没有带 scroll 属性。

我发现微信读书小程序，和我们一样用了 sticky 的方式，但它也可以传动滚动。

我是用普通 view，没有带 scroll，应该是这么解决的这种问题。

你可以试一下呢。

[jessesjessesjess]

遇到一样的问题，可是用普通 view 的话，就不能记录每个 tab 各自的滑动距离了