Flat List

FlatList adalah komponen untuk menampilkan data dari database dengan dukungan berbagai fitur seperti join, filtering, sorting, dan pagination.

Komponen ini sangat berguna untuk menampilkan data dalam bentuk daftar yang dapat disesuaikan tampilannya. Beberapa keunggulan menggunakan FlatList:

FlatList dirancang untuk mempermudah developer dalam membuat tampilan daftar data yang interaktif tanpa perlu menulis banyak kode backend.

<FlatList 
    data="users"
    fields="id, name, email"
    keyExtractor="user">
    <div class="user-item">
        <h3>{user.name}</h3>
        <p>{user.email}</p>
    </div>
</FlatList>

Attributes

Attribute	Description	Required
data	Table name in database	Yes
fields	Comma-separated list of fields to select	Yes
join	Join clause in format "TYPE:table:condition"	No
where	WHERE clause for filtering	No
orderBy	ORDER BY clause for sorting	No
limit	Number of records to return	No
keyExtractor	Variable prefix for template	Yes

Advanced Usage with Joins

<FlatList 
    data="posts"
    fields="posts.*, users.name as author_name, categories.name as category_name"
    join="LEFT:users:users.id=posts.user_id; LEFT:categories:categories.id=posts.category_id"
    where="posts.status='published'"
    orderBy="posts.created_at DESC"
    limit="10"
    keyExtractor="post">
    <div class="post-item">
        <h3>{post.title}</h3>
        <p>Author: {post.author_name}</p>
        <p>Category: {post.category_name}</p>
        <p>{post.content|truncate(200)}</p>
    </div>
</FlatList>

Join memungkinkan Anda untuk menggabungkan data dari beberapa tabel yang saling berelasi. Format join yang digunakan adalah "TYPE:table:condition" dimana:

• TYPE: Jenis join (LEFT, RIGHT, INNER)
• table: Nama tabel yang akan di-join
• condition: Kondisi join antar tabel

Multiple join dapat dilakukan dengan memisahkan setiap join menggunakan tanda titik koma (;). Pada contoh di atas, kita melakukan join ke tabel users untuk mendapatkan nama penulis dan tabel categories untuk mendapatkan nama kategori.