React native ListView 增加顶部下拉刷新和底下点击刷新示例

render() {
 if(!this.state.data){
 return(
 <Text>Loading... </Text>
 )
 }else{
 return(
 <ListView
 refreshControl={
 <RefreshControl 
 refreshing = {false}
 onRefresh = {this.reloadWordData.bind(this)}
 />
 }
 dataSource={this.state.data}
 renderRow={(rowData)=>this.renderRow(rowData)}
 renderFooter={this.renderFooter.bind(this)}
 >
 </ListView>
 
 );
 }
 }
 
renderFooter(){
 return (
 <View style={{marginVertical: 10, marginBottom:20}} >
 <Button
 onPress={this.addMoreOnFoot.bind(this)}
 title="点击载入更多"
 />
 </View>
 )
 }

addMoreOnFoot(){
 // alert('addMoreOnFoot')
 // console.log('addMoreOnFoot')
 const url = 'http://127.0.0.1/getFootContent?lastid=' + this.state.footLastId + '&count=20&isTop=0'
 fetch(url)
 .then((response)=>response.json())
 .then((jsondata)=>{
 if (jsondata.data && jsondata.data.length > 0){
 const rowData = this.state.jsondata.concat(jsondata.data);
 this.setState({
 footLastId:jsondata.data[jsondata.data.length - 1]['id'],
 jsondata:rowData,
 data:new ListView.DataSource({rowHasChanged:(r1, r2) => r1 != r2}).cloneWithRows(rowData),
 })
 }
 })
 .catch((error)=>{
 alert(error);
 });
}

render() {
 if(!this.state.data){
 return(
 <Text>Loading... </Text>
 )
 }else{
 return(
 
 <ListView
 refreshControl={
 <RefreshControl 
 refreshing = {false}
 onRefresh = {this.reloadWordData.bind(this)}
 />
 }
 dataSource={this.state.data}
 renderRow={(rowData)=>this.renderRow(rowData)}
 renderFooter={this.renderFooter.bind(this)}
 >
 </ListView>
 
 );
 }
 }

reloadWordData(){
 // alert(this.state.topLastId)
 const url = 'http://127.0.0.1/getFootContent?lastid=' + this.state.topLastId + '&count=20&isTop=1'
 fetch(url)
 .then((response)=>response.json())
 .then((jsondata)=>{
 if (jsondata.data && jsondata.data.length > 0){
 const rowData = jsondata.data.concat(this.state.jsondata);
 this.setState({
 topLastId:jsondata.data[0]['id'],
 jsondata:rowData,
 data:new ListView.DataSource({rowHasChanged:(r1, r2) => r1 != r2}).cloneWithRows(rowData),
 })
 }
 })
 .catch((error)=>{
 alert(error);
 });
 }