I'm trying to automatically scroll to the bottom of a flatlist, so here's what I have:
const scrollViewRef = useRef();
//my scroll view
<ScrollView
ref={scrollViewRef}
onContentSizeChange={() => {
scrollViewRef.current.scrollToEnd({ animated: true });
}}
Unfortunately, I encountered some errors while implementing this solution:
https://i.stack.imgur.com/oVyts.png
The first error reads as follows:
No overload matches this call.
Overload 1 of 2, '(props: Readonly<ScrollViewProps>): ScrollView', gave the following error.
Type 'MutableRefObject<undefined>' is not assignable to type 'string | ((instance: ScrollView | null) => void) | RefObject<ScrollView> | null | undefined'.
Type 'MutableRefObject<undefined>' is not assignable to type 'RefObject<ScrollView>'.
Types of property 'current' are incompatible.
Type 'undefined' is not assignable to type 'ScrollView | null'.
Overload 2 of 2, '(props: ScrollViewProps, context?: any): ScrollView', gave the following error.
Type 'MutableRefObject<undefined>' is not assignable to type 'string | ((instance: ScrollView | null) => void) | RefObject<ScrollView> | null | undefined'.
Type 'MutableRefObject<undefined>' is not assignable to type 'RefObject<ScrollView>'.ts(2769)
index.d.ts(143, 9): The expected type comes from property'ref' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<ScrollView> & Readonly<ScrollViewProps> & Readonly<...>'
index.d.ts(143, 9): The expected type comes from property 'ref' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<ScrollView> & Readonly<ScrollViewProps> & Readonly<...>'
The second error message states:
Object is possibly 'undefined'.
Any assistance or suggestions would be greatly appreciated.