Creating a tree view using the tree and tree grid components

The tree grid component allows us to create a tree view along with a grid. A sample code snippet is as follows:

<aura:application extends="force:slds"> <aura:handler name="init" value="{!this}" action="{!c.init}" /> <aura:attribute name="gridColumns" type="List" /> <aura:attribute name="gridData" type="Object" /> <aura:attribute name="gridExpandedRows" type="Object" /> <Lightning:treeGrid columns="{! v.gridColumns }" data="{! v.gridData }" expandedRows="{! v.gridExpandedRows }" keyField="name" aura:id="mytree" /> </aura:application> 

The JavaScript controller code for this component generates mock data, shown as follows. You can easily substitute mock data with data from the backend ...

Get Learning Salesforce Lightning Application Development now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.