gameboyVito / react-native-ultimate-listview

A high performance FlatList providing customised pull-to-refresh | auto-pagination & infinite-scrolling | gridview layout | swipeable-row.
https://www.npmjs.com/package/react-native-ultimate-listview
MIT License
540 stars 87 forks source link

Pull on loading not working #5

Closed liuyunqiang closed 7 years ago

gameboyVito commented 7 years ago

Please provide some detailed information, like your development environment, your code snippet.....

liuyunqiang commented 7 years ago

The old version in the tensile load in android listView without onFetch method but In the ios works

gameboyVito commented 7 years ago

I am not sure why you don't want to use onFetch method in android. If you do not want to use refresh or pagination feature, why not just implement it by simply using <View />. However, you can try to use refreshable={false} to turn off this feature.

dongodngtang commented 7 years ago

onEndReached once time,afterward never call onEndReached

dongodngtang commented 7 years ago

onEndReached once time,afterward never call onEndReached。why,who tell me ??

zhangwen9229 commented 7 years ago

把你的关键代码粘出来看看

gameboyVito commented 7 years ago

@dongodngtang Have you tried my Example? It seems like the problem is on onEndReachedThreshold. In the new FlatList, the range of this props is between 0 to 1, but in the older ListView, the range varies from 0 to your device height. However, please update your version to yarn add react-native-ultimate-listview@3.0.2 to see if you still encounter the same problem.

gameboyVito commented 7 years ago

@dongodngtang Of course, you may also have wrong use-case on onFetch() callback, please provide your code snippet so that I can review it. Thx~

dongodngtang commented 7 years ago

componentWillReceiveProps(newProps) {

    const {actionType, raceTickets, loading} = newProps;
    if (actionType === RACE_TICKET
        && loading !== this.props.loading
        && !isEmptyObject(raceTickets)) {

        const {items, last_id} = raceTickets;
        if (last_id != '0')
            this.last_id = last_id;

        if (this.listPage == 1) {
            this.listView.postRefresh(items, 1);
        } else {
            this.listView.postPaginate(items, 1)
        }

        this.setState({
            listTicket: this.listView.getRows()
        })

    }
}

onFetch = async(page = 1, startFetch, abortFetch) => { try { this.listPage = page; console.log('listPage:', page) if (page === 1) { this._onRefresh(); } else { this._onLoadMore(); }

    } catch (err) {
        abortFetch();
        console.log(err);
    }

}
dongodngtang commented 7 years ago

My react-native 0.43.4 I use Redux to manager data

gameboyVito commented 7 years ago

@dongodngtang You should not call postRefresh and postPaginate in your own component, these two methods are not public. You can try to remove your whole componentWillReceiveProps function, and then modify your onFetch method like:

onFetch = async(page = 1, startFetch, abortFetch) => {
   try {   
         const rowData = await fetchFromYourAPI('hello');
         const numOfPageItems = 20;
         startFetch(rowData, numOfPageItems);
    } catch (err) {
        abortFetch();
        console.log(err);
    }
}
denny64 commented 6 years ago

@gameboyVito how do i handle pagination? When I fetch the 2nd time, and append that to the end of my array, the listview duplicates the items..? eg. [0....30], then when i fetch again.. result is [0...30, 0...60]