How to fix "transform with key of translatex must be a number" error in React Native?

Question

I 'm trying to make a translate animation in React Native.

Here is my code

const scrollX = React.useRef(new Animated.Value(0)).current;

<Animated.ScrollView
     horizontal
     snapToInterval={width}
     onScroll={Animated.event(
        [{ nativeEvent: { contentOffset: { x: scrollX } } }],
        { useNativeDriver: false }
        )}
     scrollEventThrottle={16}
  ></Animated.ScrollView>

  <Animated.View style={{ transform: [{ translateX: multiply(scrollX, -1) }] }}>
          <Text>Some text</Text>
  </Animated.View>

I am getting this error transform with key of translatex must be a number

If I change multiply(scrollX, -1) to scrollX the animation is reversed,

How can I fix this issue ?

Answer 1

i had this issue,Just because i forgot to give Animated.View

Answer 2

I fixed it by changing the import of multiply from react-native-reanimated to Animated