解决MUI 下拉刷新页面，拉动不了的问题，主要看这里 mui-scroll-wrapper

最新推荐文章于 2022-11-18 13:49:10 发布

置顶 Chen_2017_Strive

最新推荐文章于 2022-11-18 13:49:10 发布

阅读量3.7k

点赞数 1

分类专栏： MUI前端框架文章标签：解决MUI下拉刷新页面上拉不了的问题 MUI下拉刷新

本文链接：https://blog.csdn.net/Chen_2017_Strive/article/details/90109805

版权

MUI前端框架专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
   <meta charset="UTF-8">
   <title>个人中心</title>
   <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
   <link href="../../css/common/mui.min.css" rel="stylesheet" />
   <link rel="stylesheet" type="text/css" href="../../css/common/iconfont.css" />
   <link rel="stylesheet" type="text/css" href="../../css/local/personal-center.css" />
   <link href="../../css/myself/index.css" rel="stylesheet" />

</head>
<body>
<div class="mui-content " >

<div class="mui-scroll-wrapper" id="pullrefresh">
<div class="mui-scroll" >

//js 下拉刷新操作

       mui.init({
           pullRefresh : {
           container:"#pullrefresh",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
           down : {
           style:'circle',//必选，下拉刷新样式，目前支持原生5+ ‘circle’ 样式
           // color:'#2BD009', //可选，默认“#2BD009” 下拉刷新控件颜色
           // height:'50px',//可选,默认50px.下拉刷新控件的高度,
           // range:'100px', //可选默认100px,控件可下拉拖拽的范围
           // offset:'0px', //可选默认0px,下拉刷新控件的起始位置
           auto: true,//可选,默认false.首次加载自动上拉刷新一次
           callback :pulldownRefresh //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
           }
           }
       });
       //初始化scroll控件
       // mui('.mui-scroll-wrapper').scroll({
       //    deceleration: 0.0005
       // });

//执行需要刷新获取数据的方法

       localStorage.setItem('active_act',act);
       mui.openWindow({
           url: "../Myorder/my-order.html?act="+act,
           id: "../Myorder/my-order.html?act="+act,
       });
   }
   mui('body').on('tap','.list-item',function(e){
       // document.location.href=this.href;
       this.click();
   });
   //跳转至我的帐户
   document.getElementById('ToMyaccount').addEventListener('tap', function() {
       //验证是否登录
       checkLogin();
       var user = localStorage.getItem('user_info');
       if(!user || user == null || user == ''){return false;}

       mui.openWindow({
           url: '../PersonalCenter/myaccount.html',
           id: '../PersonalCenter/myaccount.html'
       });
   });
   var cert = '';
   _get('member/real_detailed','').then(function(res){
       if(res.data){
           if(res.data.status == '0'){
               cert = '0'
           }
       }
   })
   //点击实名认证跳转到认证页
   document.getElementById('NextCertification').addEventListener('tap', function() {
       //验证是否登录
       checkLogin();
       var user = localStorage.getItem('user_info');
       if(!user || user == null || user == ''){return false;}

       if(cert == '0'){
           mui.openWindow({
               url: '../Account-manage/certification.html',
               id: '../Account-manage/certification.html'
           });
       }
       if(real == '0'){
           mui.openWindow({
               url: '../Account-manage/identification.html',
               id: '../Account-manage/identification.html'
           });
       }
       if(real == '1'){
           mui.openWindow({
               url: '../Account-manage/certification.html',
               id: '../Account-manage/certification.html'
           });
       }
   });
   //跳转至系统设置
   document.getElementById('NextSetting').addEventListener('tap', function() {
       //验证是否登录
       checkLogin();
       var user = localStorage.getItem('user_info');
       if(!user || user == null || user == ''){return false;}

       mui.openWindow({
           url: '../PersonalCenter/setting.html',
           id: '../PersonalCenter/setting.html'
       });
   });
   //跳转至我的收藏
   document.getElementById('NextMycollection').addEventListener('tap', function() {
       //验证是否登录
       checkLogin();
       var user = localStorage.getItem('user_info');
       if(!user || user == null || user == ''){return false;}

       mui.openWindow({
           url: '../PersonalCenter/my-collection.html',
           id: '../PersonalCenter/my-collection.html'
       });
   });
   //跳转至账号管理
   document.getElementById('ToManage').addEventListener('tap', function() {
       //验证是否登录
       checkLogin();
       var user = localStorage.getItem('user_info');
       if(!user || user == null || user == ''){return false;}

       mui.openWindow({
           url: '../Account-manage/manage-home.html',
           id: '../Account-manage/manage-home.html'
       });
   });
   //跳转至消费券
   document.getElementById('ToVolume').addEventListener('tap', function() {
       //验证是否登录
       checkLogin();
       var user = localStorage.getItem('user_info');
       if(!user || user == null || user == ''){return false;}

       mui.openWindow({
           url: '../Bringforward/consumption-volume.html',
           id: '../Bringforward/consumption-volume.html'
       });
   });
   //跳转至帮助中心
   document.getElementById('helpCenter').addEventListener('tap', function() {
       mui.openWindow({
           url: '../questionsHelpFeedback/helpHomePage.html',
           id: '../questionsHelpFeedback/helpHomePage.html'
       });
   });
   //跳转至分享中心
   document.getElementById('shareCore').addEventListener('tap', function() {
       //验证是否登录
       checkLogin();
       var user = localStorage.getItem('user_info');
       if(!user || user == null || user == ''){return false;}

       mui.openWindow({
           url: '../PersonalCenter/shareCore.html',
           id: '../PersonalCenter/shareCore.html'
       });
   });
</script>
</body>
</html>

Chen_2017_Strive

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
解决MUI 下拉刷新页面，拉动不了的问题，主要看这里 mui-scroll-wrapper

<!doctype html><html><head> <meta charset="UTF-8"> <title>个人中心</title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-sc...
复制链接

扫一扫