react-nativeflash-list

FlashList's rendered size is not usable with View Wrapper


I am using FlashList with a twist, I have a state controlling if the list show or not, I tried several ways and all gives the same result FlashList's rendered size is not usable. Either the height or width is too small (<2px). Please make sure that the parent view of the list has a valid size. FlashList will match the size of the parent.

this is my code

   <View
          style={{
            minHeight: 9,
            minWidth: 9,
            padding: 9,
          }}
        >
          <FlashList
            keyExtractor={({id}) => id}
            data= cardOpen ? data: []}
            estimatedItemSize={9}
            extraData={cardOpen}
            renderItem={({item}) => (
              <OrderItemComponent item={item} expanded={cardOpen} />
            )}
          />

Anyone?


Solution

  • Following the FlashList documentation, we should use it inside a View with a hard-coded height-style number like this:

    <View style={{ height: Dimensions.get("screen").height-100, width: Dimensions.get("screen").width }}>
        <FlashList
           ...
        />
    </View>