CODEWITHSUNDEEP
react-nativereact-native-reanimatedreact-native-gesture-handlerreact-native-draggable-flatlist
Christophe Salou
Christophe Salou

Reputation: 11

React-Native "cannot read property '_isReanimatedSharedValue' of null" with react-native-draggable-flatlist

When I try to use the react-native-draggable-flatlist library, after installing react-native-reanimated, react-native-gesture-handler and react-native-draggable-flatlist, I get this error message "cannot read property '_isReanimatedSharedValue' of null". But I don't know where to change this value.

React-Native: 0.71.3 react-native-reanimated: 3.0.0 react-native-gesture-handler: 2.9.0 react-native-draggable-flatlist: v4

Thanks for your help

import DraggableFlatList, {
  RenderItemParams,
  ScaleDecorator,
} from 'react-native-draggable-flatlist';
import { GestureHandlerRootView } from 'react-native-gesture-handler';

const DragAndDrop = () => {
  const [steps, setSteps] = useState<Item[]>(mySteps);

  const renderItem = ({ item, drag, isActive }: RenderItemParams<Item>) => {
    return (
      <ScaleDecorator>
        <TouchableOpacity
          onLongPress={drag}
          disabled={isActive}
          style={[
            styles.rowItem,
            { backgroundColor: isActive ? 'red' : 'yellow' },
          ]}>
          <Text style={styles.text}>{item.name}</Text>
        </TouchableOpacity>
      </ScaleDecorator>
    );
  };

  return (
    <GestureHandlerRootView>
      <SafeAreaView style={{ margin: 10 }}>
        <DraggableFlatList
          data={steps}
          onDragEnd={({ data }) => setSteps(data)}
          keyExtractor={item => item.id.toString()}
          renderItem={renderItem}
        />
      </SafeAreaView>
    </GestureHandlerRootView>
  );
};

Upvotes: 1

Views: 781

Answers (1)

Shahaed
Shahaed

Reputation: 460

This seems to be fixed in reanimated v3.0.1 (github.com/software-mansion/react-native-reanimated/pull/4128)

Upvotes: 0

Related Questions