Wednesday, February 8, 2023
HomeiOS Developmentjavascript - React Native FlatList in ScrollView Excessive Lag

javascript – React Native FlatList in ScrollView Excessive Lag


So I’ve a display the place customers can add an merchandise to a FlatList that seems on their profile, one thing like slightly card that can say “Blue”, after which have an image of the colour throughout from it (for demo functions). The difficulty is that I would like the FlatList to constantly checklist the objects with out forming its personal scroll container, and permit the ENTIRE display to scroll with the FlatList because it will get bigger and bigger.

What I’ve tried:
Commonplace FlatList within ScrollView:

const knowledge = [
  {
   id: 102391231241123123,
   name: 'Blue',
   picture: someURI
  }
]

<KeyboardAwareScrollView>
  <FlatList
    knowledge={knowledge}
    renderItem={renderItem}
    keyExtractor={merchandise => merchandise.id}
  /> 
<KeyboardAwareScrollView />

The problems with this are as listed:

  1. Prompts the “Virtualized Record” error about nesting two inside each other.
  2. After two or three objects, display begins to lag intensively.

Thanks for the assistance



Supply hyperlink

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments