Vue Data GridTree Data - Overview

Enterprise

Tree Data provides a way to supply structured hierarchical data for displaying in the grid.

Enabling Tree Data

To enable Tree Data set the treeData property to true in the grid options, and provide a getDataPath callback to configure the Row Hierarchy

treeData
boolean
default: false
Set to true to enable the Grid to work with Tree Data. You must also implement the getDataPath(data) callback.
getDataPath
GetDataPath
Callback to be used when working with Tree Data when treeData = true.

The example above uses the following configuration to enable Tree Data:

<ag-grid-vue
    :treeData="treeData"
    :getDataPath="getDataPath"
    /* other grid options ... */>
</ag-grid-vue>

this.treeData = true;
this.getDataPath = data => data.path;

Next Up

Continue to the next section to learn how to provide a Row Hierarchy.