Error "Attempt to assign to readonly property" while using interpolate in React Native

242 Views Asked by At

I have a FlatList and a View above it. All I want is when scroll down the FlatList, the View height drops to zero. I use interpolate to do this and here is my code :

...
const scorllY = useRef(new Animated.Value(0)).current;
 const getCounterHeight = () => {
        return scorllY.interpolate({
            inputRange: [0, 50],
            outputRange: [25, 0],
            extrapolate: 'clamp'

        })
    }

     <View style={{ ...styles.update, height: getCounterHeight }}>
         ...
     </View>
     <Animated.FlatList data={rankList} keyExtractor={item => item.id}
                    renderItem={({ item }) => (
                        <UserRankInfo id={item.id} username={item.name} point={item.point} />
                    )} showsVerticalScrollIndicator={false} scrollEventThrottle={16}
                    onScroll={Animated.event(
                        [
                            {
                                nativeEvent: { contentOffset: { y: scorllY } }
                            }
                        ], { useNativeDriver: true }
                    )} />

When I ran the code I got this error. Anyone can tell me how to fix it ?

0

There are 0 best solutions below