Vue DataGrid - paging

Configures paging.

Selector: DxPaging
Type: common/grids:PagingBase

Paging allows the UI component to load data in portions instead of loading it simultaneously. To enable paging, set the paging.enabled property to true.

Users can switch between pages and change paging settings using the pager or they can scroll the pages. Paging settings apply with any scrolling mode.

DataGrid Demo TreeList Demo

See Also

enabled

Enables paging.

Type:

Boolean

Default Value: true

pageIndex

Specifies the page to be displayed using a zero-based index.

Selector: page-index
Type:

Number

Default Value: 0
Raised Events: onOptionChanged

pageSize

Specifies the page size.

Selector: page-size
Type:

Number

Default Value: 20
Raised Events: onOptionChanged

The page size determines how many rows the UI component loads at a time. All the loaded rows are rendered. If this reduces the UI component's speed, set the rowRenderingMode to "virtual" to render only the rows in the viewport. Alternatively, you can decrease the page size.

DataGrid Demo TreeList Demo

See Also