vue 和mui组合使用之 mui中pullRefresh的使用

想要实现的效果是：在页面中上拉加载更多的数据，在没有更多的数据时提示用户没有更多的的数据了。
我的代码如下所示：
HTML代码：

<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
            <div class="mui-scroll">
                这里为你页面要显示的数据
            </div>
        </div>

Javascript代码：

mounted: function () {
                mui.init({
                    swipeBack: true,
                    pullRefresh: {
                        container: '#pullrefresh',
                        up: {
                            auto: true,
                            contentrefresh: "加载中......",//可选，正在加载状态时，上拉加载控件上显示的标题内容
                            contentnomore: '没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
                            callback: function () {
                                setTimeout(function () {
                                    scoreVue.PageIndex = scoreVue.dataList.length / scoreVue.PageSize;
                                    scoreVue.getData();
                                    if (!scoreVue.hasDada) {
                                        mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);//没有更多数据了
                                    } else {
                                        mui('#pullrefresh').pullRefresh().endPullupToRefresh(false);
                                    }
                                }, 1000);
                            }
                        }
                    }
                });
                var deceleration = mui.os.ios ? 0.003 : 0.0009;
                mui('.mui-scroll-wrapper').scroll({
                    bounce: false,
                    indicators: false, //是否显示滚动条
                    deceleration: deceleration
                });
            }
        });

如何修改该组件中上拉刷新的样式：
mui-spinner可以用来自定义文字前面那个加载的loading的样式
/下拉 上拉 刷新文字的样式/

        .mui-pull-caption {  
            width: 144px;  
            height: 31px;  
            font-size:0px;
        }  
        /*下拉 上拉 刷新圆形进度条的大小和样式*/  

        .mui-spinner {  
            width:20px;
            height:20px;
        }  
        .mui-spinner:after {  
        	background-image: url(../images/circle.png);  
        }  
        /*下拉 上拉 刷新的箭头颜色*/  

        .mui-icon-pulldown {  
        	 color: #e4e4e4;  
        }  

.mui-pull-caption:not(.mui-pull-caption-nomore) {

}
这样就仅在有数据时显示你的图标，没数据后继续显示mui默认的“没有更多数据了”；

若想继续自定义“没有更多数据了”的样式，则重写如下css即可：

.mui-pull-caption-nomore{

}
有一个我个人认为不太好的地方，没有办法设置初始值，如默认显示：上拉加载更多数据，如果有大神知道怎么设置初始值，欢迎留言