React-native-draggable-flatlist: refreshing, onRefresh are not working

Created on 8 Jan 2020  路  13Comments  路  Source: computerjazz/react-native-draggable-flatlist

"react": "16.9.0"
"react-native": "0.61.4"
"react-native-draggable-flatlist": "https://github.com/computerjazz/react-native-draggable-flatlist.git"
Jan 8 2020

Most helpful comment

This worked for me.

Import RefreshControl from react-native
import { RefreshControl } from 'react-native';

And use it like this

<DraggableFlatList 
      showsVerticalScrollIndicator={false}
      contentContainerStyle={{
        paddingBottom: 50,
      }} 
      refreshControl={
        <RefreshControl
          tintColor={'#FCF450'}
          onRefresh={_onRefresh}
          refreshing={refreshing}
        />
      }
      data={draggableList}
      renderItem={_renderDraggableItem}
      keyExtractor={(item, index) => `draggable-item-${index}`}
      onDragEnd={_onDragEnd}
/>

The DraggableFlatlist component spreads the props to the interior FlatList.

This one is working fine. guys please follow this props for onRefresh in draggable flat list.
Thanks but onScroll is not working..

All 13 comments

This worked for me.

Import RefreshControl from react-native
import { RefreshControl } from 'react-native';

And use it like this

<DraggableFlatList 
      showsVerticalScrollIndicator={false}
      contentContainerStyle={{
        paddingBottom: 50,
      }} 
      refreshControl={
        <RefreshControl
          tintColor={'#FCF450'}
          onRefresh={_onRefresh}
          refreshing={refreshing}
        />
      }
      data={draggableList}
      renderItem={_renderDraggableItem}
      keyExtractor={(item, index) => `draggable-item-${index}`}
      onDragEnd={_onDragEnd}
/>

The DraggableFlatlist component spreads the props to the interior FlatList.

Thanks @Karthik-B-06
I will check it later.
Does it mean this component has prop which name is RefreshControl?

@bingbing720 No.
RefreshControl https://reactnative.dev/docs/refreshcontrol is a component used inside a for enabling pull to refresh functionality. The component spreads the props to the inside, accepts refreshControl prop because it inherits all props of .

Same problem here... Using RefreshControl works, but the scroll stop work.

@kevinpiske Are you facing the issue in android ??

@Karthik-B-06 yes, not tested on iOS.

Same problem in android here, in iOS looks good (i'm testing).

This worked for me.

Import RefreshControl from react-native
import { RefreshControl } from 'react-native';

And use it like this

<DraggableFlatList 
      showsVerticalScrollIndicator={false}
      contentContainerStyle={{
        paddingBottom: 50,
      }} 
      refreshControl={
        <RefreshControl
          tintColor={'#FCF450'}
          onRefresh={_onRefresh}
          refreshing={refreshing}
        />
      }
      data={draggableList}
      renderItem={_renderDraggableItem}
      keyExtractor={(item, index) => `draggable-item-${index}`}
      onDragEnd={_onDragEnd}
/>

The DraggableFlatlist component spreads the props to the interior FlatList.

This one is working fine. guys please follow this props for onRefresh in draggable flat list.
Thanks but onScroll is not working..

Looks like pull-to-refresh is still not working on Android

 ...
      refreshControl={
        <RefreshControl
          tintColor={'#FCF450'}
          onRefresh={_onRefresh}
          refreshing={refreshing}
        />
      }
 ...

I'm having the same issue :/

    <DraggableFlatList
                onDragEnd={onDragEnd}
                data={favouriteTeams}
                renderItem={renderTeam}
                keyExtractor={(item, index) => index.toString()}
                refreshControl={<RefreshControl refreshing={favouriteTeamsAreLoading} onRefresh={refreshFavouriteTeams} />}
                contentContainerStyle={isEmpty(favouriteTeams) && ApplicationStyles.center}
                ListEmptyComponent={<Text style={ApplicationStyles.text.regular}> 
                {Language.favouritesScreen.noFavouriteTeamsAdded}</Text>}
            />

This worked for me.
Import RefreshControl from react-native
import { RefreshControl } from 'react-native';
And use it like this

<DraggableFlatList 
      showsVerticalScrollIndicator={false}
      contentContainerStyle={{
        paddingBottom: 50,
      }} 
      refreshControl={
        <RefreshControl
          tintColor={'#FCF450'}
          onRefresh={_onRefresh}
          refreshing={refreshing}
        />
      }
      data={draggableList}
      renderItem={_renderDraggableItem}
      keyExtractor={(item, index) => `draggable-item-${index}`}
      onDragEnd={_onDragEnd}
/>

The DraggableFlatlist component spreads the props to the interior FlatList.

This one is working fine. guys please follow this props for onRefresh in draggable flat list.
Thanks but onScroll is not working..

If not please see #242 and use it in that way but it, not a solution.. you have your swipe at the topmost of the screen.

Same problem. Works on IOS but not on Android

Any updates on this issue?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

canpoyrazoglu picture canpoyrazoglu  路  7Comments

DavidFlores91 picture DavidFlores91  路  10Comments

gazedash picture gazedash  路  5Comments

ymohdriz picture ymohdriz  路  7Comments

ZeroCool00 picture ZeroCool00  路  7Comments