Evanss
Evanss

Reputation: 23613

React Native Draggable Flatlist only works within ScrollView but errors?

Im using React Native Draggable Flatlist:

https://github.com/computerjazz/react-native-draggable-flatlist

This code works functionality but I get an error:

const MyComponent = ({ items }) => {
  const renderItem = ({ item, index, drag, isActive }) => {
    return (
      <View style={{ flexDirection: "row" }}>
        <TouchableOpacity
          style={{
            backgroundColor: isActive ? "blue" : "gold",
            marginBottom: 10
          }}
          onPressIn={drag}
        >
          <Text>Move</Text>
        </TouchableOpacity>
        <InputText index={index} text={item} />
      </View>
    );
  };

  return (
    <ScrollView>
      <DraggableFlatList
        data={items}
        renderItem={renderItem}
        keyExtractor={(item, index) => `${index}`}
        onDragEnd={(e) => console.log(e)}
      />
    </ScrollView>
  );
};

VirtualizedLists should never be nested inside plain ScrollViews with the same orientation - use another VirtualizedList-backed container instead.

If I change ScrollView to View then the error goes away, however now I can't see any of the items.

Upvotes: 1

Views: 817

Answers (0)

Related Questions