TableFlatList

<TableFlatList /> est un composant Layout utilisé pour concevoir des onglets comportant principalement d'une liste avec sections. Il est notamment utilisé dans les paramètres.

Celui-ci est utilisé principalement pour afficher un grand nombre de données dans des List tout en privilégiant les performances. Il faut impérativement l'utiliser si un écran se compose principalement de List avec beaucoup de données ou des informations chargées depuis un environnement externe.

Exemple

Cet exemple affiche 3 élements dans une section.

example.tsx

Copier

<TableFlatList
  sections={[
    {
      title: "Première section",
      items: [
        {
          title: "Je suis un Item",
          description: "Je décris un item"
        },
        {
          title: "Je suis un autre Item",
          description: "Je décris cet autre item"
        },
        {
          papicon: <Papicons.Butterfly />,
          title: "Je suis mieux que vous",
          description: "Pourquoi ? J'ai une icône géniale !"
        }
      ]
    }
  ]}
/>

Propriétés

TableFlatList étend les propriétés de FlatList.

sections ^_(*)

Éléments a afficher dans la liste

engine

Composant FlatList wrappé et utilisé pour le rendu de la liste. 3 options disponibles.

• FlatList

  • Composant de liste par défaut de React Native

• FlashList (expérimental)

  • Plus performant que FlatList

  • Maintenu et très documenté

  • Ne fonctionne pas pour le moment avec TabFlatList et le background

• LegendList

  • Beaucoup plus performant que les deux autres

  • Instable avec des layouts complexes

Types

Section

Une section contient un header avec son titre et une icône, ainsi que le contenu (des SectionItem).

SectionItem

Un item retourne un <Item /> conçu pour apparaître dynamiquement dans une section.