mui的下拉刷新的用法及其解決雙滾動的辦法

內容頁面需統一按照以下 DOM 結構構建

<!--下拉刷新容器-->
<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
  <div class="mui-scroll">
    <!--數據列表-->
    <ul class="mui-table-view mui-table-view-chevron">
      
    </ul>
  </div>
</div>
複製代碼

其次，經過 mui.init 方法中 pullRefresh 參數配置下拉刷新各項參數，以下：

<script>
	  mui.init({
		  pullRefresh : {
		    container:"#refreshContainer",//下拉刷新容器標識，querySelector能定位的css選擇器都可，好比：id、.class等
		    down : {
		      height:50,//可選,默認50.觸發下拉刷新拖動距離,
		      auto: true,//可選,默認false.首次加載自動下拉刷新一次
		      contentdown : "下拉能夠刷新",//可選，在下拉可刷新狀態時，下拉刷新控件上顯示的標題內容
		      contentover : "釋放當即刷新",//可選，在釋放可刷新狀態時，下拉刷新控件上顯示的標題內容
		      contentrefresh : "正在刷新...",//可選，正在刷新狀態時，下拉刷新控件上顯示的標題內容
		      callback :pullfresh-function //必選，刷新函數，根據具體業務來編寫，好比經過ajax從服務器獲取新數據；
		    }
		  }
});
	</script>
複製代碼

下拉刷新當數據較多時可能會出現雙滾動條，解決辦法以下

mui('.mui-scroll-wrapper').scroll({
	deceleration: 0.1, //flick 減速係數，係數越大，滾動速度越慢，滾動距離越小，默認值 0.0006 
    indicators: false  //隱藏一條滾動條 增大減速係數。。。
});
複製代碼