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

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

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

一个类似于聊天的效果,要求数据加载完成后,滚动条必须在最后。但是,如果数据是原始数据的话,使用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://www.yuyunhe.cn/index.php/post/240.html

分享给朋友:

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

php获取从百度搜索进入网站的关键词

<?php    function search_word_from() {     $referer = isset($_SERVER['HTTP_REFERER'])?...

抓取最近八天天气(非利用接口,直接从网站提取)

<?php    /*     *特别注意,第一天没有最高气温数据,第八天没有最低气温数据     *注意对数字进行过滤时不要忘记对负号进行判断   &nb...

php无限分类-总结

//php代码部分  <?php         header('Content-Type:text/html;charset=utf-8');    ...

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编码...

PHP开发之THINKPHP多表联合查询操作的三种方法

THINKPHP 中关联查询(多表查询)可以使用 table() 方法或和join方法,请看示例: 联合查询         1、原生查询    &...

解决The current branch is not configured for pull No value for key branch.master.merge found in config

1.在本地工程目录找到config文件(我的是在D:\wamp\youthstartup\.git);2.修改config文件内容为:[core]    repositoryformatversion = 0    filemode = false ...

发表评论

访客

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