I have onboarding and slide components . I am passing ref as a prop to slide component from onboarding component with forwardRef . It works fine but typescript gives me an error
My components are like below
const Onboarding = () => { const { width } = useOrientation(); const scrollX = new Animated.Value(0); const scroll = useRef<Animated.ScrollView>(null); const onScroll = (event: any) => { Animated.event([{ nativeEvent: { contentOffset: { x: scrollX } } }]); }; return (<Box flex={1}><Animated.ScrollView ref={scroll} scrollEventThrottle={16} onScroll={onScroll} horizontal> {slides.map((data, index) => (<Slide key={index} data={data} ref={scroll} {...{ index, scrollX }} /> ))}</Animated.ScrollView></Box> );};interface SlideProps { data: { label: string; description: string; src: string; }; scrollX: Animated.Value<0>; index: number;}export const Slide = forwardRef<Animated.ScrollView, SlideProps>( ({ data, scrollX, index }: SlideProps, ref) => { const { width, height } = Dimensions.get("window"); const aspect = height / width; return (<Box flex={1} width={width} backgroundColor="mainBackground"><TouchableOpacity onPress={() => //error here ref?.current?.getNode().scrollTo({ x: width * (index + 1), y: 0 }) }><Text>heyy</Text></TouchableOpacity></Box> ); });Error is like this;Property 'current' does not exist on type '((instance: ScrollView | null) => void) | MutableRefObject<ScrollView | null>'.How can I fix this issue ? Thanks.