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.
setPage(number)
navigates to a specific page
setPageSize(number)
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