Component FlatList trong React Native là gì?

FlatList là một component trong React Native được sử dụng để hiển thị danh sách dữ liệu dạng phẳng (flat lists) một cách hiệu quả. Nó hỗ trợ nhiều tính năng hữu ích và được tối ưu hóa cho việc render các danh sách dài, có thể thay đổi theo thời gian.

Tính năng của FlatList:

• Hiệu suất cao: Chỉ render các phần tử hiện đang hiển thị trên màn hình, không phải tất cả các phần tử cùng một lúc.
• Hỗ trợ đa nền tảng: Hoạt động trên cả iOS và Android.
• Chế độ ngang: Có thể hiển thị danh sách theo chiều ngang.
• Hỗ trợ header và footer: Cho phép thêm các component ở đầu và cuối danh sách.
• Hỗ trợ separator: Có thể thêm các dấu phân cách giữa các phần tử.
• Pull to Refresh: Cho phép thực hiện hành động kéo để làm mới danh sách.
• Scroll loading: Hỗ trợ tải thêm dữ liệu khi cuộn danh sách.
• ScrollToIndex: Cho phép cuộn đến một phần tử cụ thể dựa trên chỉ số.
• Hỗ trợ nhiều cột: Có thể hiển thị danh sách dưới dạng lưới với nhiều cột.

Cách sử dụng FlatList:

Để sử dụng FlatList, bạn cần cung cấp hai prop chính là data và renderItem:

• data: Mảng dữ liệu mà bạn muốn render.
• renderItem: Hàm nhận mỗi phần tử từ data và trả về một component được định dạng để render.

Ví dụ cơ b...