木灵鱼儿
阅读:234
最后更新:2022/12/01/ 13:56:25
解决vant的tab组件swipeable功能与内部scroll冲突的问题
看了下vant的tab组件源码,当开启swipeable功能后,其实会对容器监听touch事件,这就导致我们在内容部分存在横向的滚动的时候,会导致同时触发touch事件,从而产生了冲突。
解决办法就是二选一,要不在这个横向scroll的时候不触发swipeable,要不放弃swipeable。
如果是第一种方案,我们需要对存在横向scroll的容器元素,做一个事件冒泡阻断,问题就解决了。
<div @touchstart.stop @touchmove.stop @touchend.stop>
scroll的div
</div>
版权申明
本文系作者 @木灵鱼儿 原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。
相关推荐
vant框架Layout布局中col元素不够宽度变形的解决办法
用Layout的时候,我设置的是一行三个元素显示,但是有时候,遍历的对象可能无法满足一行三个显示,结果发现col元素会把拉伸一部分宽度。这就很尴尬了,我在使用其他框架的这种布局的时候都没遇到这种情况,没办法,只能用死办法,我给你补上几个空col了那么,如何计算需要补充几个呢?假设我们要遍历的数组名为:oneArr创建一个计算属性:fillArr() { const remainder = Math.ceil(this.indusArr.length % 3); if (remainder !== 0) { return 3 - remainder;...
关于作者
木灵鱼儿
以前觉得活下去很难,现在发现活的好才难!
站点职位 博主
获得点赞 0
文章被阅读 234