/TypeScript/VirtualizedLists should never be nested inside plain ScrollViews with the same orientation - use another VirtualizedList-backed container instead.

VirtualizedLists should never be nested inside plain ScrollViews with the same orientation - use another VirtualizedList-backed container instead.

Here is a VirutalizedList -backed container implementation using FlatList:

import React from 'react';
import { FlatList } from 'react-native';

export default function VirtualizedView(props: any) {
  return (
    <FlatList
      data={[]}
      ListEmptyComponent={null}
      keyExtractor={() => "dummy"}
      renderItem={null}
      ListHeaderComponent={() => (
        <React.Fragment>{props.children}</React.Fragment>
      )}
    />
  );
}
Usage:

<VirtualizedView>
  <Text>Anything goes here</Text>
  <FlatList 
    data={data}
    keyExtractor={keyExtractor}
    renderItem={({item}) => <Item data={item} />}
    onRefresh={refetch}
    refreshing={loading}
    onEndReached={concatData}
  />
</VirtualizedView>

This will show scrollbar when you rotate your iPhone, and also remove warning message and performance will be saved without any problem.

VirtualizedLists should never be nested inside plain ScrollViews with the same orientation - use another VirtualizedList-backed container instead

<SafeAreaView style={{flex: 1}}>
    <FlatList
      data={data}
      ListHeaderComponent={ContentThatGoesAboveTheFlatList}
      ListFooterComponent={ContentThatGoesBelowTheFlatList} />
</SafeAreaView>

-1

Source: stackoverflow.com

Virtualizedlists should never be nested inside plain scrollviews with the same orientation

<ScrollView>
    {data.map((item, index) => {
        ...your code
    }}
</ScrollView>

-1

Source: stackoverflow.com

Similar codes

1 vote278 views1 answer
Main concepts in asp.net core
TypeScript
0 vote370 views1 answer
Type alias in typescript
TypeScript
0 vote289 views1 answer
Surround substring with quotes
TypeScript
0 vote286 views1 answer
Lire un fichier de valeurs séparées par des points (csv) dans DataFrame
TypeScript
1 vote295 views1 answer
How do i remove the brackets around a list in python
TypeScript
32 votes317 views6 answers
List without bullets html
TypeScript
0 vote305 views1 answer
Map gRPC error
TypeScript
5 votes336 views5 answers
Angular 8 ngClass If
TypeScript
0 vote302 views1 answer
Kick bots command cs go
TypeScript
3 votes292 views1 answer
Model has no objects member django
TypeScript