当前位置:首页 > 技术文档 > 正文内容

MUI动态加载数据后,scrollToBottom无效的解决方案

admin9年前 (2017-07-14)技术文档1919

一个类似于聊天的效果,要求数据加载完成后,滚动条必须在最后。但是,如果数据是原始数据的话,使用scrollToBottom是可以滚动到底部的。但是如果是动态数据的话,就无效了。

找了很多方法,官方QQ群里也问过了,解释的也不是很看的懂。最后没办法,只能去翻代码了。看了下scrollToBottom的方法定义中有一行是这样的:

this.scrollTo(0, this.maxScrollY, time, easing);

通过浏览器控制台获取maxScrollY的值很悲剧的为0!!!!!

而maxScrollY的获取就是在reLayout函数当中,于是乎,重新调用一下reLayout就可以更新maxScrollY了。完整的解决方案如下:

//页面加载后,初始化滚动条
var scroll = mui('.mui-scroll-wrapper').scroll();
//获取列表数据
$.post(apiURL, {}, function(data) {
    //插入列表
    insertDomByData(data);    //重新计算布局值,最大滚动的高度等等
    scroll.reLayout();    //滚动到底部
    scroll.scrollToBottom(100);
});

image.png

分享到:

扫描二维码推送至手机访问。

版权声明:本文由云河空间发布,如需转载请注明出处。

本文链接:https://yuyunhe.cn/index.php/post/240.html

分享给朋友:

“ MUI动态加载数据后,scrollToBottom无效的解决方案” 的相关文章

如何自己手工获取自己的Access Token

如何自己手工获取自己的Access Token

在使用WP2PCS前,你需要了解,WP2PCS目前只支持百度网盘,(将来将支持360网盘和腾讯微云,这要看它们的API什么时候开放, 且容易开发)是基于百度PCS的API开发的,和坊间流传的抓取百度网盘文件直链不同,WP2PCS从百度网盘获取文件的源(二进制流),是百度许可并鼓 励开发者使用的接...

Zend Studio 8打开utf-8文件出现乱码解决方法

Zend Studio 8打开utf-8文件出现乱码解决方法

今天安装了zend studio 8.0.1,运行了一个PHP程序项目(项目文件编码为utf-8),发现utf-8文件中的中文全部变成乱码了,后面终于经过寻找探索,找到了问题所 在:虽然你的项目是UTF-8编码文件,但是当通过zend studio工具运行打开时,是以工具里设定的GBK编码...

thinkphp获取URL参数

一般情况下URL中的参数就是通过GET方法获取,但是由于PATHINFO的特 殊性,URL地址最终需要被解析才能转换成GET参数,ThinkPHP对URL是按照一定的规则进行解析的,除非你使用了URL路由规则,如果你对 URL做了特别的定制,但是又不想使用URL路由,那么可以使用框架提供的URL...

phpcms v9更换模板的具体操作方法

phpcms v9更换模板的具体操作方法

这篇文章主要介绍了phpcms v9更换模板的具体操作方法,需要的朋友可以参考下分享一下Phpcms V9更换模板的具体操作方法先分享下大概的步骤:1、上传模版文件到服务器;2、在站点管理 里边【模板风格配置】选择新模板;3、设置不同模型对应模板;4、修改现有的栏目,匹配新模板;5、更新栏目缓存、系...

jQuery UI 使用入门

jQuery UI 使用入门

 最近项目中使用了一些插件来做页面,这里把jQuery UI的使用分享出来,希望 对新手有帮助。文章结尾附源码下载。1 jQuery UI        有时你仅仅是为了实现一个渐变的动画效果而不得不把javascrip 重新学习一遍然后书写大量代码。直到...

jQuery编程的最佳实践

加载jQuery1.坚持使用CDN来加载jQuery,这种别人服务器免费帮你托管文件的便宜干嘛不占呢。点击查看使用CDN的好处,点此查看一些主流的jQuery CDN地址。<script type="text/javascript" src="...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。