RecyclerListView Error in React Native APP

Question

This is my code:

<RecyclerListView
    layoutProvider={this._layoutProvider}
    dataProvider={this.state.dataProvider}
    rowRenderer={this._rowRenderer}
></RecyclerListView>

And I get the error:

LayoutException: RecyclerListView needs to have a bounded size. Currently height or, width is 0.Consider adding style={{flex:1}} or, fixed dimensions

Answer 1

Wrap your recyclerlistview in a view

You can give height to the view or you can give height to the style under recyclerlistview. Example:

<View style={{
    marginTop:5,
    marginBottom:5,
    backgroundColor:"#f3f3f3",
    height:"100%"}>  //Here
                
    <RecyclerListView
        dataProvider={this.state.dataProvider}
        layoutProvider={this.layoutProvider}
        rowRenderer={this.rowRenderer}
        style={{height:"100%",}} //or Here, If you add here then the last row of your rendered data list will not have any issue and may fulfill your all issues
    
        onEndReached={this.fetchMore}
        onEndReachedThreshold={0.5}
        renderFooter={()=>{
            <Text style={{padding:10, fontWeight:"bold", textAlign:"center"}}>
    Loading... </Text>
    }}

Answer 2

According to a few issues from Github it solves easy (wrap it and set minHeight/minWidth = 1 in a wrapper).

<View style={{ minHeight: 1, minWidth: 1 }}> 
     <RecyclerListView ... />
</View>

PS: For my case (vertical list) I added 'minHeight: 1' only.