setData({ scrollTop: 0 // 设置滚动位置为0,实现返回顶部 }); } }); 在这个示例中,我们创建了一个包含多个项目的 scroll-view 组件,并在页面底部添加了一个“返回顶部”按钮。当点击该按钮时,会触发 goTop 函数,该函数将 scrollTop 的值设置为 0,从而使 scroll-view 滚动到顶部。同时,我们还监听了 ...
data: {bodyText:'',// 展示的文本内容scrollTop:0// 竖向滚动条的位置} 定义一个方法,设置滚动条定位到底部 autoScroll() {letthat =thisletquery = wx.createSelectorQuery()// 通过class选择器定位到scorll-viewquery.select('.scroll-text').boundingClientRect(res=>{ that.setData({// 由于res.height...
1.上下滚动因为高度的问题,scrollView没有填满所剩下的空间,没有实现区域滚动 scroll-top 不生效的问题 ,比如想滚动到底部 在用这个标签之前,很多地方需要阅读官方文档比如这句话 :用竖向滚动时,需要给 一个固定高度,通过 css 设置 height。 我的第二个问题就是因为没有设置高度导致 scroll-top不生效,但是设置高...
1.scroll-view的高度需要设置固定的值,比如全屏可以设置:height:100vh; 2.不可以同时设置scroll-into-view和scroll-top(scroll-left)属性,因为scroll-into-view的优先级别比scroll-top(scroll-left)属性高(官方文档提及过); 3.scroll-top(scroll-left)属性不可以带单位,直接设置值就可以了,如:scroll-top="50";...
@scroll="scroll"></scroll-view> 下滑屏幕输出scrollTop会发现其值在回退变小,导致视图抖动: 网上寻找的解决方法是去除绑定的scroll-top,删除之后可以滑动,但是功能模块需要绑定其值,作为返回顶部的功能双向绑定值。所以我想寻找能够保留scroll-top的值,又能不抖动的方法。
scroll-into-view:值为string,值应为它的某子元素的id名称,设置为哪个方向可滚动,则在哪个方向滚动到该子元素; scroll-with-animation:在设置滚动条位置时是否有动画,值为boolean,默认是false; enable-back-to-top:当ios点击顶部状态栏,安卓双击标题栏时,滚动条回到顶部,且只在竖向滚动时有效,值为boolean,默认为...
小程序scroll-view翻转后 scroll-into-view的替代方案 背景 腾讯云医小程序有医患聊天会话的场景,由于会话场景存在查询历史消息的场景,小程序中按照常规思路加载历史消息时会出现跳动的问题;跳动的原因是由于在’顶部’插入dom,会使得后面的dom被往后面推,然后重新设置scroll-top或者scrol-into-view从而导页面出现跳动;我...
2、小程序中另一种实现滚动条的方式,是使用scroll-view组件。官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/component/scroll-view.html 详细的参数,请仔细查看官方文档~ 示例代码: class="scroll-view"scroll-y style="height: 500px;"scroll-top="{{scrollTop}}">id="green"class="bc_green">id...
scroll-view是小程序中的可滚动视图组件,用于展示可滚动区域。组件属性包含:scroll-x: 允许横向滚动,值为布尔值,默认为false;scroll-y: 允许竖向滚动,值为布尔值,默认为false;使用竖向滚动时,需要设置固定高度,通过WXSS设置height。upper-threshold: 表示距顶部/左边多远(px)时触发scrolltoupper...
微信小程序中 scroll-view滚动条始终在最底部,1.再做微信小程序聊天得时候,聊天得消息比较多,所以需要每次将滚动框移到最底部。刚开始试了scroll-top,等都无效。最后决定使用scroll-into-view也无效。2.解决办法:scroll-into-view指向得view得id须要再整个页面加载完后