List view
Last updated
Last updated
© 2024 UI Bakery
List view component serves to display the collection of items. By default, the list view contains an image and a text field, which can be replaced with the required components. If you need to create a custom layout, you can add the necessary components to the first list item. The added components are replicated for the other list view items.
Method | Description |
---|---|
| navigates to a specific page |
| sets the number of items displayed per page in a list view |
Triggers allow you to launch certain actions based on different events.
On Init | Calls for an action on component's initialization |
On Page Change | Calls for an action when the list page is changed |
The list view component supports both static and dynamic data.
To display the data dynamically from your action, refer to it as {{actions. yourLoadDataAction.data}}
in the Data field of the component.
You can access any of the list items by referencing it as {{item}}
, e.g. {{item.first_name}}
:
To reference the index of the item, use the {{index}} variable.
If you have a large dataset, you might want to use server-side pagination with a list view component. Please refer to the guide below for setup:
Server-side pagination