How do I load a specific page as initial page in Flatlist in react native?-CodePudding

Suppose I have more than 100 data. Now when implementing Flatlist the initial page that loads is the first item from the data. Now my question is how do I load a specific data 50th data and still be able to scroll up or down.

CodePudding user response：

If you go with the function-based approach, you need to add

const flatListRef = useRef(null);

In useEffect(), focused scroll to specific index with scrollToIndex() function.

setTimeout(() => flatListRef.scrollToIndex({ animated : true, index : DATA[50] }), 500);
//replace DATA and add anything to index you want to focus

And in return(),

<FlatList
    ref={ flatListRef }
    data={DATA}
    ...
/>

Hope this works for you.

CodePudding user response：

FlatList has a prop called initialScrollIndex, check it here