react-nativepull-to-refreshreact-native-listview

React Native: Refresh Control not available if I clear the Listview data source


When I set the data source to my listview, refresh control (pull down to refresh) works perfectly fine. In case the data source is empty, I am not able to pull down to refresh the listview.

My listview looks like this:

                <View contentContainerStyle={{flex: 1}}>
                    <ListView
                        style={styles.container}
                        dataSource={this.state.dataSource}
                        renderRow={(data) => <NotificationRow {...data}/>}
                        enableEmptySections={true}
                        refreshControl={
                            <RefreshControl
                                refreshing={this.state.refreshing}
                                onRefresh={this._onRefresh.bind(this)}
                                tintColor="#ff0000"
                                title="Loading..."
                                titleColor="#ffffff"
                                colors={['#ffffff']}
                                progressBackgroundColor="#1976D2"
                            />
                        }
                    />
                </View>

Is there any props I need to set to Listview or any other way to enable pull down to refresh the listview even if the data source is empty/null?

I am looking for this feature because for the 1st time, I am loading the data from Async Storage. On pull down to refresh, I clear the storage and fetch new data.


Solution

  • Pull down to refresh works if I pull from the region starting from red line

    Figured this out when I tested the app on my phone instead of emulator. The List View is always present even though the datasource is empty. In my case, the listview began where the Text view finished at the red line.