Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

FlatList scrollToIndex using useRef with Typescript - Type Error

$
0
0

I am working with FlatList and I want to create one ref to be able to scroll the FlatList when pressing one button.

The thing is that I am using Typescript and I am having one type error that I am not able to solve.

The question is, how do I create an interface for a FlatList ref?

There we have one example of what I am doing.

let flatListRef = useRef();<FlatList  ref={flatListRef} // Error Here  data={store.data}  ... /><Button   onPress={() =>    flatListRef.current.scrollToIndex({index:index})  } />

The type error that I am having is when I set the ref into the FlatList

The error says:

Overload 1 of 2, '(props: FlatListProps<{ data: string; type: number;id: number; }> | Readonly<FlatListProps<{ data: string; type: number;id: number; }>>): FlatList<...>', gave the following error.Type 'MutableRefObject' is not assignable to type 'LegacyRef<FlatList<{ data: string; type: number; id: number; }>> |undefined'.Type 'MutableRefObject' is not assignable to type 'RefObject<FlatList<{ data: string; type: number; id: number; }>>'.Types of property 'current' are incompatible.Type 'undefined' is not assignable to type 'FlatList<{ data: string; type: number; id: number; }> | null'.

Overload 2 of 2, '(props: FlatListProps<{ data: string; type:number; id: number; }>, context: any): FlatList<{ data: string; type:number; id: number; }>', gave the following error.Type 'MutableRefObject' is not assignable to type 'LegacyRef<FlatList<{ data: string; type: number; id: number; }>> |undefined'.

When I set the type to the ref when I create it, the error does not solve, something like:

interface ListProps {  data: string;  type: number;  id: number; }let flatListRef = useRef<ListProps>()

Or do I need to pass the data structure or something as initialValue when I create the useRef hook?


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>