小程序view在ios中下拉或上拉到顶时疯狂抖动

最新推荐文章于 2024-04-29 16:52:08 发布
最新推荐文章于 2024-04-29 16:52:08 发布
阅读量2k 收藏 2
点赞数
文章标签： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43496650/article/details/108216781
版权

最近在小程序中，在view内使用了vant-weapp的count-down倒计时组件，在ios中滚动到顶或者到底时，页面疯狂抖动。
我们都知道，在ios中，当view overflow:auto时，view在下拉到顶部或者底部时会有一部分弹性距离，但是当这个view内有setData发生时，view会立即复原，从而导致你在拉到底部时弹性距离刚出现一部分又被setData复原了，如果一直拉住不放就会一直重复这个过程，所有在我们看来就是页面在疯狂的抖动了

解决办法：使用page的滚动不使用view的滚动能规避这个问题，也可以使用scroll-view，然后启用enhanced再关闭bounces

enhanced在ios里面发现了一个问题，当使用了enhanced后，进入下一页在返回后scroll-view不能滚动

不是流氓不是兔
关注
微信小程序-解决iOS系统下拉或者拖动整个页面出现白底问题【亲测有效】
**My Coding Family**
03-17 1万+
微信小程序-解决iOS系统下拉或者拖动整个页面出现白底问题【亲测有效】
微信小程序实现页面下拉刷新和上拉加载
kerryqpw的博客
10-18 3273
微信小程序实现页面下拉刷新和上拉加载
详解iOS中position:fixed吸底时的滑动出现抖动的解决方案
08-26
主要介绍了详解iOS中position:fixed吸底时的滑动出现抖动的解决方案，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
uniapp使用scroll-view，在iphone上，顶部底部上下拉，会产生抖动
qq_37698249的博客
09-26 2063
造成抖动的原因是因为在scroll-view上，添加了scroll-top属性（用作锚点定位） 改用生命周期onPageScroll，来实现滚动加载 锚点定位改用 uni.pageScrollTo({ scrollTop: 0, duration: 300 });
uniapp scroll-view防抖
weixin_45849330的博客
04-15 1833
<scroll-view @scroll="scroll" @scrolltolower="scrolltolower" :scroll-anchoring="true" scroll-y scroll-with-animation :scroll-top="scrollTop" class="wh"> </scroll-view> scrollTop: 0, old: { scrollTop: 0 }, // 滚动 scroll(e) { // this.scr
微信小程序---scroll-view在苹果手机上触底或触顶页面闪动问题
10-08 1394
在项目开发中遇到一个关于scroll-view的的问题，具体如下： 项目要求是横向滚动，由于直接在scroll-view组件设置display：flex不生效，因此考虑直接在scroll-view下增加一个wrap，将所有的item放在wrap内， 将wrap设置为display：flex,这种方式在安卓手机不会导致任何问题，在苹果手机样式也不会有什么问题，但是当item的个数较多导...
微信小程序-解决scroll-view抖动
weixin_44943268的博客
06-21 9282
微信小程序scroll-view抖动 原因：产品需要点击换一换，列表置顶并刷新，所以需要动态绑定scroll-view里面的scrollTop属性 scrollTop属性用法需要保存@scroll时的值，如果在@scroll时直接复制给scrollTop的话 就会出现页面抖动 解决：@scroll时复制给一个变量，点击换一换时再将变量赋值给scrollTop ...
微信小程序在ios中下拉出现“橡皮筋”效果
黄腾霄的博客
07-14 3517
今天和大家聊一聊微信小程序在ios中下拉出现“橡皮筋”效果 问题现象 话不多说，先看代码（使用taro编写）。 代码很简单，一个flex的容器+一个允许进行下拉刷新的ScrollView，就组成了一个最简demo const TicketRecordsPage = () => { const revenueData = new Array(10).fill(0).map((_, i) => i) return ( <View className={styles['root
微信小程序scroll-view实现下拉刷新
逆袭的菜鸟X
05-13 1645
1、使用方法 <super-scroll-view class="phone-body" bind:lower="onReachBottom" bind:pulldown="onPullDownRefresh" refreshertriggered="{{refreshertriggered}}"> // 这里是滚动内容 </super-scroll-view> 2、源码 super-srcoll-view.wxml <scroll-view clas
微信小程序-scroll-view横向滚动和上拉加载
热门推荐
前端向朔
03-04 2万+
今天介绍微信小程序中scroll-view实现横向滚动和上拉加载的实现及需要注意的地方。 先看最终效果。横向滚动1.设置滚动项display：inline-block; 2.设置滚动视图容器white-space: nowrap; 3.滚动项不要用float为什么会有以上三点要求呢？ 其实横向滚动官方文档中是没有做太多说明的，只说明需要定义scroll-view滚动方向scroll-x=tr
微信小程序实现组件顶端固定或底端固定效果(不随滚动而滚动)
10-15
主要介绍了微信小程序实现组件顶端固定或底端固定效果(不随滚动而滚动)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
小程序，吸顶，position fixed 抖动解决办法
weixin_36878452的博客
03-12 2595
采用position:absolute结合fixed，做吸顶技术方案，会导致元素抖动 解决办法使用position:sticky,元素设置top,高度 小程序官方例子 https://developers.weixin.qq.com/community/develop/doc/0004ecd4fb4bd892ca184d5d156800
微信小程序scroll-view滚动到底部一直抖动
qq_39931894的博客
10-21 1798
微信小程序滚动到底部一直抖动 微信小程序中使用了scroll-view之后，滚动到底部就会一直在抖动。 解决办法： 1.把scroll-view里面的fixed元素全部放到外面，里面不要有fixed元素 2.用page默认的滚动
微信小程序--组件 下拉加载下一页（scroll-view 并防止抖动）
最新发布
m0_45857808的博客
04-29 655
scroll-view 滚动加载并防止抖动
【小程序】scroll-view在ios机型滚动不流畅
lily19970107的博客
11-27 894
这个问题不是滚动补流程的问题，是scrollView高度设置的有问题，因为项目是自定义navbar和tabbar，scrollView的高度应该设置为windowHeight-navbarHeight-底部的padding,有的页面没有就可以减底部的padding。可以为scrollView设置。
ios下，微信小程序scrollview组件中的fixed元素抖得和帕金森病人一样
hahahhahahahha123456的博客
02-28 1130
问题现象 这个问题是最近在优化小程序代码时发现的。 在ios环境下，微信小程序的scrollview组件包裹着一个position：fixed的view。 当在scrollview组件上滑动时，这个view会疯狂抖动。 直接上图吧： 下面是简化后的代码： <view class="main"> <scroll-view scroll-y="{{true...
关于微信小程序 scroll-view 在IOS中所存在的一些问题
weixin_43311271的博客
05-21 7437
最近在对小程序进行一些优化，发现 scroll-view 的两处问题 1、IOS手机下scroll-view会存在上拉加载时卡顿情况 暂时解决方法(设置高度为100%，问题：设置后不能触发上拉触底事件)： <scroll-view scroll-y="true" style="height:100%"> </scroll-view> ...
完美解决safari、微信浏览器下拉回弹效果、包含微信小程序 webview 套H5页面下拉效果。
从入门到放弃
06-06 782
如题，解决微信小程序、公众号 下拉回弹橡皮筋效果， 屏蔽掉 “此网页由XXXXX提供”;
小程序ios 屏幕左右晃动的原因
qq_45314999的博客
04-25 2860
微信小程序项目，发现iOS部分页面，左右可以滑动，安卓机没有此种情况。经过查阅分析，是部分元素超过了屏幕尺寸大小
Android实现iOS上拉下拉弹性效果代码示例
"这篇文章主要介绍了Android仿iOS上拉下拉弹性效果的实现代码，通过自定义一个名为MyReboundScrollView的ScrollView子类来达到类似的效果。这种弹性效果常见于iOS设备，可以提升用户操作的流畅性和体验感。" 在...
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值