本文實例為大家分享了上拉加載下拉刷新組件mescroll.js的具體代碼，供大家參考，具體內容如下

附上鏈接地址http://www.mescroll.com/api.html#NPM，手機端和瀏覽器都能夠使用，唯一推薦；
使用過程中要注意這些問題http://www.mescroll.com/qa.html；

使用注意事項：

1、引入的時候出問題及時看官方給出的解決方案(基本上都必須看)；

2、react中一定要在dom渲染之后的方法（didMount）中初始化，因為這個需要拿到dom對象；

3、在react工程中，回調的數據一定要拼接，這是要注意的（datas:ctx.state.datas.concat(json.info)）；

4、很坑需要單頁的里的html和body高度設置100%。

下邊附上簡易代碼

import React, { Component, PropTypes } from 'react'; import MeScroll from "mescroll.js"  class StretchingUp extends Component {   constructor(props, context) {     super(props, context);     this.state={       datas:[],       total:0,     }     this.test = this.test.bind(this);   }   componentDidMount(){     document.ondragstart=function() {return false;}     let ctx = this;     var mescroll = new MeScroll ( "mescroll" , {down : { use:false}, up : {       use:true,       auto:true,       offSet:100,       page:{         num:0,         size:20,         time:null       },       onScroll:function(mescroll, y, isUp){       },       callback:function (page, mescroll) {         ctx.test(page, mescroll);       },       error: function (e) {       }     }} ) ;     mescroll.resetUpScroll()   }   test(page, mescroll){     console.log(page)     let url = "http://localhost:5577/curpage/"+page.num+"/pagesize/"+page.size;     let ctx = this;     fetch(url,{       method:'GET',       headers: {         'Accept': 'application/json',         'Content-Type': 'application/json',       },     }).then((resp)=>{       if(resp){         return resp.json();       }else{         return false;       }     })     .then((json)=>{         ctx.setState({         datas:ctx.state.datas.concat(json.info),         total:json.total       },()=>{     })      mescroll.endSuccess();     return true;   });   }   render() {     return (       <div id="mescroll" className="mescroll" style={{height: "500px",overflow: "auto"}}>       {this.state.datas.map((item,index)=>(         <div key={index}>           {item.id}         </div>       ))}       </div>   );   }}  export default StretchingUp; 

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持錯新站長站。