List view

List view component serves for displaying 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.

Methods

MethodDescription

setPage(number)

navigates to a specific page

setPageSize(number)

sets the number of items displayed per page in a list view

Triggers

Triggers allow you to launch certain actions upon 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

Working with a list

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.

Accessing list items

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.

Server-side pagination

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:

pageTable server side pagination

Last updated