cube-ui icon indicating copy to clipboard operation
cube-ui copied to clipboard

slide嵌套scroll后内外层滚动相互影响

Open comDotCyx opened this issue 5 years ago • 3 comments

Version

1.12.34

Reproduction link

https://codesandbox.io/s/vue-template-9btuy

Steps to reproduce

1 最外层是slide 2 每个slide里面使用纵向的scroll做下拉刷新和加载更多 3 某个slide里纵向的scroll又嵌套了一个横向的scroll(或者slide)

What is expected?

最里层横向的scroll横向滚动不会带动最外层slide滚动,但是纵向可以带动中间的scroll滚动

What is actually happening?

1 最里面的scroll使用options.stopPropagation:true导致纵向不能带动中间的scroll滚动,添加options.eventpassthrough:'vertical'也不行。 2 最里面的scroll使用options.stopPropagation:false(默认),则里面不能滚动,滑动的时候会拖动最外面的slide

Dependencies Version

vue: 2.6.9 better-scroll: 1.15.0


能否达到,最里层scroll只阻止横向冒泡,不阻止纵向冒泡的效果

comDotCyx avatar Dec 04 '19 15:12 comDotCyx

目前还做不到。之后会支持。

tank0317 avatar Dec 06 '19 03:12 tank0317

@tank0317 谢谢,非常期待!

comDotCyx avatar Dec 06 '19 13:12 comDotCyx

可通过在纵向的scroll嵌套的横向的scroll(或者slide)添加touch事件解决这个问题,在touchstart时设置最外层Slide的scrollX = false,touchend时,设置最外层Slide的scrollX = true,然后refresh最外层slide

itcql avatar Nov 16 '21 09:11 itcql