This project is deprecated. Use DevExtreme Vue instead.

DxCustomGrouping Plugin Reference

A plugin that converts custom formatted grouped data to a supported format and performs local group expanding/collapsing.

Import

Use the following statement to import the plugin:

import { DxCustomGrouping } from '@devexpress/dx-vue-grid';

User Reference

Dependencies

Properties

Name Type Default Description
getChildGroups (currentRows: Array<any>, grouping: Grouping, rootRows: Array<any>) => Array<{ key: number | string, value?: any, childRows?: Array<any> }>   A function that extracts groups from the specified data. It is executed recursively for the root and nested groups.
grouping? Array<Grouping> | null   Specifies columns by which data is grouped.
expandedGroups? Array<GroupKey> | null   Specifies the expanded groups.

Plugin Developer Reference

Imports

Name Plugin Type Description
rows Getter Array<any> Rows to be grouped.
grouping Getter Array<Grouping> The current grouping state.
expandedGroups Getter Array<GroupKey> Groups to be expanded.

Exports

Name Plugin Type Description
rows Getter Array<any> Rows with the applied grouping and expanded groups.
grouping Getter Array<Grouping> The specified data’s current grouping state.
expandedGroups Getter Array<GroupKey> Groups expanded in the specified data.
isGroupRow Getter (row: any) => boolean A function used to identify a group row within ordinary rows.
getRowLevelKey Getter (row: any) => string? A function used to get a group row level key.
getCollapsedRows Getter (row: any) => Array<any>? A function used to get collapsed rows associated with the given row.