在uni-app中,实现scroll-view滚动到底部,可以通过以下几种方法来完成: 1. 使用scroll-into-view属性 通过给scroll-view内的每个子元素设置唯一的id,并使用scroll-into-view属性指定要滚动到的子元素的id。 示例代码: html <template> <scroll-view :scroll-into-view="scrollToView" scroll-y="true...
输入内容后,必然要在对话界面的底部显示内容,可以通过uni.pageScrollTo的方式,但是这个页面刷新的太厉害,输入框都刷新了,没法使用。所以只能使用scroll-view组件。但是通过scroll-view使用竖向滚动时,需要给 一个固定高度。为了适配屏幕的大小,则需要通过计算来确定scroll-view的高度。 <viewclass="content"id="content"...
输入内容后,必然要在对话界面的底部显示内容,可以通过uni.pageScrollTo的方式,但是这个页面刷新的太厉害,输入框都刷新了,没法使用。所以只能使用scroll-view组件。但是通过scroll-view使用竖向滚动时,需要给 一个固定高度。为了适配屏幕的大小,则需要通过计算来确定scroll-view的高度。 <view class="content" id="conte...
之后我发现还可以滚动到指定元素的位置,于是我在页面的最下方添加了一个dom <viewstyle="width: 100%;height: 1px;"class="count_big_box"id="count_big_box"></view> 使用下面的方法: uni.pageScrollTo({ duration:300, selector:'#count_big_box'}); 这次可以了,滚动到页面最底部的问题解决了,但我...
滚动到底部的最直接的方法 1、使用 scroll-into-view 属性 uniapp 模板 初始化、动态设置不同的 state.into 值 数组、容器【滚动区高度、宽度...
二、滚动值变量定义 data(){return{//评论区滚动高度commentScrollTop:0,...}} 三、滚动到底部的方法 //滚动到底部scrollToBottom(){letquery=uni.createSelectorQuery().in(this)query.select('#commentContainer').boundingClientRect()query.select('#commentContent').boundingClientRect()query.exec((res)...
回答:内容自动滚动到可视化区域的底部,你可以自己写一个函数,在页面加载完成后调用即可,这个功能一般不需要采用组件来实现,书写起来也并不复杂,简单的逻辑如下: function getMaxHeight() { messageContainer = document.getElementsByClassName("message-container")[0]; messageContainer.scrollTo({ top: messageContainer...
2.2.1、<scroll-view></scroll-view>,定义需要滚动的区域 2.2.2、:scroll-y,允许纵向滚动 2.2.3、@scrolltolower="lower",事件:滚动到底部/右边时触发,可以调用加载下一页数据了 2.2.4、:refresher-enabled="true",属性:开启自定义下拉刷新 2.2.5、@refresherrefresh="refresher",事件:自定义下拉刷新被触发,...
页面滚动到底部的事件(不是scroll-view滚到底),常用于下拉下一页数据。可以设置距离底部多少距离拉取数据,在pages.json里定义具体页面底部的触发距离onReachBottomDistance,比如设为50,那么滚动页面到距离底部50px时,就会触发onReachBottom事件。 示例: //fn 定义 fn(e) { let that = this let http = 'xxx' ...
官方默认无论page的滚动条在哪个位置, 只要在scroll-view页面上下拉都会触发下拉函数, 这样用户体验非常差. 可以使用@scroll滚动时触发的函数来获取scroll-view滚动条的位置, 进而来控制refresher-enabled开启和关闭自定义下拉刷新. 当scroll-view的滚动条滚动到顶部时, 使refresher-enabled为true, 其他条件为false。