Korzystanie z list
Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →
React Native oferuje zestaw komponentów do prezentacji danych w formie list. Zazwyczaj będziesz chciał użyć FlatList lub SectionList.
Komponent FlatList wyświetla przewijaną listę danych, które mogą się zmieniać, ale mają podobną strukturę. FlatList sprawdza się szczególnie przy długich listach, gdzie liczba elementów może się zmieniać w czasie. W przeciwieństwie do bardziej ogólnego ScrollView, FlatList renderuje tylko elementy aktualnie widoczne na ekranie, a nie wszystkie naraz.
Komponent FlatList wymaga dwóch właściwości (props): data i renderItem. data to źródło informacji dla listy. renderItem pobiera pojedynczy element ze źródła i zwraca sformatowany komponent do wyrenderowania.
Ten przykład tworzy podstawową FlatList ze statycznymi danymi. Każdy element we właściwości data jest renderowany jako komponent Text. Komponent FlatListBasics renderuje następnie FlatList i wszystkie komponenty Text.
Jeśli chcesz wyświetlić zestaw danych podzielony na logiczne sekcje, być może z nagłówkami sekcji – podobnie jak UITableView w iOS – wtedy najlepszym wyborem będzie SectionList.
Jednym z najczęstszych zastosowań widoków listowych jest wyświetlanie danych pobranych z serwera. Aby to zrobić, będziesz musiał dowiedzieć się o sieci w React Native.