1

i want pagination in my react native application so below is my code

 <ListView bounces={false}
          enableEmptySections={ true }
          automaticallyAdjustContentInsets={ false }
          dataSource={this.state.dataSourceRadio}
          renderRow={(rowData, sectionID, rowID) => this.renderSiteView(rowData, rowID)}
          onEndReached={this.onEndReached}
        />

onEndReached() {
if (!this.state.waiting) {

    this.state.offset=10,
    this.APIGetSiteGPS(this.state.token); 
}

}

When i run above code next page data not come so any idea how can i solve this? your all suggestion are appreciable

I update my view in this method

 _bindingRadioButtonData(data) {


this.setState({

  dataSourceRadio:  this.state.dataSourceRadio.cloneWithRows(data),
})

}

API call methods

APIGetSiteGPS(token) {
console.log(TAG + "customer Api: " + APPCONSTANTS.BASE_URL + "site" + " " + token)
fetch(APPCONSTANTS.BASE_URL + "site?&offset=" + this.state.offset, {
  method: APPCONSTANTS.API_METHOD.GET,
  headers: {
    'Accept': APPCONSTANTS.HEADERS.VALUE.ACCEPT,
    'Content-Type': APPCONSTANTS.HEADERS.VALUE.CONTENT_TYPE,
    'Authorization': 'Bearer ' + token,
  },
})
  .then(response => {
    const statusCode = response.status;
    const data = response.json();
   // data: offset === 0 ? res.results : [...this.state.siteList, ...res.results];
    return Promise.all([statusCode, data]);
  })
  .then((res, data) => {
    this.responseReceive(res)
  })
  .catch((error) => {
    this.stopLoadingIndicator()
    console.log('error..', error);
  })

}

 responseReceive(response) {

this.stopLoadingIndicator()
console.log(TAG + 'Response-->' + JSON.stringify(response));

var temp = this.state.siteList;

if (response[0] == APPCONSTANTS.API_RESPONSE_STATUS.SUCCESS) {
  for (let i = 0; i < response[1].data.sites.length; i++) {
    temp.push(response[1].data.sites[i]);
  }  

  this.setState({ siteList: temp})

  setTimeout(() => {this._bindingRadioButtonData(this.state.siteList)}, 1000)

  this.setState({isFirstDataLoad:true});

  //this.onEndReached();

} else {
  Alert.alert(APPCONSTANTS.APP_NAME, response[1].message)
}

}

5
  • You should provide more info. When you said When i run above code next page data not come, where is your update code for this.state.dataSourceRadio? Commented Dec 29, 2017 at 8:58
  • @Khoa: see my update question Commented Dec 29, 2017 at 10:52
  • I think the use of this within your setTimeout() is the issue: stackoverflow.com/a/11714413/1346610 Commented Dec 29, 2017 at 16:19
  • try to remove setTimeout and bring the callback of it to setState like this: this.setState({ siteList: temp }, () => this._bindingRadioButtonData(this.state.siteList)) Commented Dec 31, 2017 at 9:37
  • 1 more suggestion that: don't use ListView (it's deprecated as doc). Try FlatList (another official one) for better usage interface and performance (according to docs) Commented Dec 31, 2017 at 9:40

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.