MUI上拉刷新下拉加载

使用之前引入文件


<link rel="stylesheet" href="../lib/mui/css/mui.css">
<script src="../lib/mui/js/mui.js"></script>

 

HTML

//  lt_view 为下拉-上拉的容器  里面必须加一层嵌套 div   
<div class="lt_view">
    //2 div 为额外添加的嵌套
    <div>
      //3 .lt_content 为存放数据的容器
        <ul class="lt_content">
        数据
        </ul>
    </div>
  </div>

CSS

/* 给最外层容器加上 相对定位 */
.lt_view{
  position: relative;
}

初始化JavaScript的

 mui.init({
  pullRefresh: {
    container: ".lt_view",
    down: {
      auto: true,
      //  触发下拉刷新时自动触发
      callback: function () {
      }
    },
    up:{
      //  触发上拉刷新时自动触发
      callback:function () {
      }
    }
  }
});

API

// 结束下拉刷新
mui('.lt_view').pullRefresh().endPulldownToRefresh();

// 结束上拉加载更多 如果没有数据 传入 true 否则 传入 false
mui('.lt_view').pullRefresh().endPullupToRefresh();

// 重置 组件
mui('.lt_view').pullRefresh().refresh(true);

猜你喜欢

转载自blog.csdn.net/weixin_40983119/article/details/84504435