Load a FlatList from the End to Display a Chat in React Native

by
Tiempo de lectura: < 1 minuto

Reading time: < 1 minutes

Today I’m going to show you how you can load a flatlist in reverse order to display a conversation (chat) using React Native.

We are using the FlatList library that comes with the React Native package.

import {FlatList} from 'react-native';

To display the items in reverse order (loaded from the bottom instead of the top), we need to add the inverted property to our flatlist, like this:

 <FlatList
                inverted
                data={itemList}
                renderItem={({ item }) =>
                    <RowChat
                        elementoRow={item}
                    />
                }
            />

(do not include the Reading time). Return it directly in HTML format. Do not write any additional sentences. Add a PIPE at the end when you’re finished.

Post Views: 7

Leave a Comment