Wcheng
Wcheng
  • 发布:2016-06-24 15:28
  • 更新:2016-06-24 16:54
  • 阅读:3729

【报Bug】MUI选项卡上拉刷新下拉加载例子的js有问题

分类:MUI

详细问题描述
[内容]

一开始启动APP打开页面进去滑动切换选项卡没问题,返回之后再打开页面滑动选项卡的时候选项卡的导航没有跟随选项卡动,报的是 Uncaught TypeError: Cannot read property '0' of undefined at js/mui.js:3447 这样的错误

我是这样解决:

this.currentPage = this.pages[Math.min(index, this.pages.length - 1)][0];
换成
if(this.pages[Math.min(index, this.pages.length - 1)]==undefined){
this.currentPage={"x":0,"leftX":-49,"rightX":-48,"pageX":1,"element":{}};
}else{
this.currentPage = this.pages[Math.min(index, this.pages.length - 1)][0];
}
重现步骤
[步骤]
步骤就是问题描述内容
[结果]
[期望]

运行环境
手机
[系统版本]
安卓5.1
[浏览器版本]
[IDE版本]
7.2.2.2
[mui版本]
2016年6月15号在官网下的,不知道是啥版本了
附件
[代码片段]

mui.init();  
            (function($) {  
                //阻尼系数  
                var deceleration = mui.os.ios?0.003:0.0009;  
                $('.mui-scroll-wrapper').scroll({  
                    bounce: false,  
                    indicators: false, //是否显示滚动条   
                    deceleration:deceleration  
                });  
                $.ready(function() {                      
                    mui.ajax(serverurl+'AppData/Article.php',{  
                        dataType:'json',      
                        type:'get',        
                        timeout:10000,  
                        success:function(data){  
                            var cateBox = document.querySelector('#cateBox');  
                            var cateData = data['cate'];                              
                            var cateHtml = '';  
                            var activeCate = 0;    
                            var i=0;  
                            for(var i in cateData){  
                                if(activeCate==0){  
                                    cateHtml = '<a class="mui-control-item mui-active" href="#item'+cateData[i].id+'mobile">'+cateData[i].name+'</a>';    
                                }else{  
                                    cateHtml = '<a class="mui-control-item" href="#item'+cateData[i].id+'mobile">'+cateData[i].name+'</a>';  
                                }  
                                cateBox.innerHTML += cateHtml;  
                                activeCate++;  
                            }  
                            var articleBox = document.querySelector('#articleBox');  
                            var articleData = data['article'];  
                            var articleHtml = '';  
                            var activeCate = 0;  
                            var activeArticle = 0;  
                            var c=0;   
                            for(var c in cateData){  
                                if(activeCate==0){  
                                    var a=0;  
                                    var Article = '';  
                                    for (var a in articleData) {  
                                        if(articleData[a].catid==cateData[c].id){  

                                            Article+= '<li class="mui-table-view-cell">'+articleData[a].title+'</li>'   

                                        }  
                                    }  

                                    articleHtml += '<div id="item'+cateData[c].id+'mobile" class="mui-slider-item mui-control-content mui-active">'  
                                                        +'<div id="scroll1" class="mui-scroll-wrapper">'  
                                                            +'<div class="mui-scroll">'  
                                                                +'<ul class="mui-table-view">'                                                            
                                                                +Article                                                                  
                                                                +'</ul>'  
                                                            +'</div>'   
                                                        +'</div>'  
                                                    +'</div>';    
                                }else{  
                                    var a=0;  
                                    var Article = '';  
                                    for (var a in articleData) {  
                                        if(articleData[a].catid==cateData[c].id){  

                                            Article+= '<li class="mui-table-view-cell">'+articleData[a].title+'</li>'   

                                        }  
                                    }  
                                    articleHtml += '<div id="item'+cateData[c].id+'mobile" class="mui-slider-item mui-control-content">'  
                                                        +'<div id="scroll" class="mui-scroll-wrapper">'  
                                                            +'<div class="mui-scroll">'  
                                                                +'<ul class="mui-table-view">'  
                                                                +Article   

                                                                +'</ul>'  
                                                            +'</div>'  
                                                        +'</div>'  
                                                    +'</div>';    
                                }  

                                //console.log(articleHtml)  
                                articleBox.innerHTML = articleHtml;  
                                activeCate++;  
                            }  

                            //循环初始化所有下拉刷新,上拉加载。  
                            $.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {  
                                $(pullRefreshEl).pullToRefresh({  
                                    down: {  
                                        callback: function() {  
                                            var self = this;  
                                            setTimeout(function() {  
                                                var ul = self.element.querySelector('.mui-table-view');  
                                                ul.insertBefore(createFragment(ul, index, 10, true), ul.firstChild);  
                                                self.endPullDownToRefresh();  
                                            }, 1000);  
                                        }  
                                    },  
                                    up: {  
                                        callback: function() {  
                                            var self = this;  
                                            setTimeout(function() {  
                                                var ul = self.element.querySelector('.mui-table-view');  
                                                ul.appendChild(createFragment(ul, index, 5));  
                                                self.endPullUpToRefresh();  
                                            }, 1000);  
                                        }  
                                    }  
                                });  
                            });  
                        },  
                        error:function(xhr,type,errorThrown){   
                            w.close();  
                        }   
                    });  

                    var createFragment = function(ul, index, count, reverse,data) {  
                        //console.log(JSON.stringify(data['']));  
                        var length = ul.querySelectorAll('li').length;  
                        var fragment = document.createDocumentFragment();  
                        var li;  
                        for (var i = 0; i < count; i++) {  
                            li = document.createElement('li');  
                            li.className = 'mui-table-view-cell';  
                            li.innerHTML = '第' + (index + 1) + '个选项卡子项-' + (length + (reverse ? (count - i) : (i + 1)));  
                            fragment.appendChild(li);  
                        }  
                        return fragment;  
                    };  
                });  

            })(mui);  
        </script>

[安装包]

联系方式
[QQ]
[电话]

2016-06-24 15:28 负责人:无 分享
已邀请:
BoredApe

BoredApe - 有问题就会有答案。

mui什么版本的?
请上传能重现该问题的测试工程

  • 4***@qq.com

    这个bug一直都没修复,左右选项卡+下拉,动态加载,初始化后,左右滑动会报错。

    2016-09-22 10:38

  • BoredApe

    给一个能重现问题的测试工程

    2016-09-23 11:12

该问题目前已经被锁定, 无法添加新回复