Warning using ListItem, FlatList inside ScrollView JSON-CodePudding

I get this warning when I tried using Flatlist inside View but same error occurs:

ERROR VirtualizedLists should never be nested inside plain ScrollViews with the same orientation because it can break windowing and other functionality - use another VirtualizedList-backed container instead.

AND item.name not showenter image description here

class Product extends Component {
  state = {};

  render() {
    const {product_type} = this.props;
    return (
      <SafeAreaView>
        <ScrollView showsHorizontalScrollIndicator={false}>
          {
            <FlatList
              keyExtractor={(item, index) => index.toString()}
              data={product_type}
              renderItem={({item}) => (
                <ListItem
                  title={item.name}
                  subtitle={item.subtitle}
                  subtitleStyle={{color: 'gray'}}
                  bottomDivider
                  chevron
                  onPress={() =>
                    this.props.navigation.navigate('ProductDetail', {item})
                  }
                />
              )}
            />
          }
        </ScrollView>
      </SafeAreaView>
    );
  }
}

CodePudding user response：

Try this way

renderItem = ({ item }) => (
  <ListItem bottomDivider>
    <ListItem.Content>
      <ListItem.Title>{item.name}</ListItem.Title>
      <ListItem.Subtitle>{item.subtitle}</ListItem.Subtitle>
    </ListItem.Content>
    <ListItem.Chevron />
  </ListItem>
)