支付宝小程序scroll-into-view跳转list无效解决

2019-12-03  本文已影响0人  柚子皮肤

今天想写个点击跳转到指定位置的demo,就利用scroll-view的scoll-into-view属性,设置好toView后发现滑动并不管用,试了半天,发现有好几个问题,

1.scroll-view设置了高度100%,发现它不会滑动了,即使来回滑能滑动,但是点击toView的时候,一点反应没有。于是又看了一下它的文档,发现文档上有个很重要的提示:“使用竖向滚动时,需要指定固定高度,可通过 acss 设置 height。” 就按照提示改了scroll-view的高度,之后可以滑动了。

官方文档

这里说明下,因为scroll-view相对于父视图view绝对定位,当设置高度100%时,由于view是个容器,其高度是根据内容而定的,所以子视图scroll-view的高度也就跟父视图一样了,自身高度跟内容高度一样,而scroll-view滑动的条件是内容高度大于其自身高度,所以无法滑动。我们看到的滑动其实是window的滑动,而不是scroll-view。

2.如下图所示,直接将toView的id设置到list标签上,发现滚动到指定位置无效。设置在list头部,就好了。

设置list的ID

3.本来以为这样就可以了,但是又发现个问题:当设置了toView的id后,一开始点击的时候,是可以跳转到指定位置的,但跳转之后,再手动将scroll-view滑动到顶部,然后再点击滑倒指定位置的按钮,发现又无效了,不会滑动,一点反应没有。

1

解决方法:在监听滑动的方法里,将toView置空,就可以了。

上一篇下一篇

猜你喜欢

热点阅读