0

How to implement "lightning:tree" variants "Grid" ?

Ref: https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/aura_compref_lightning_tree.htm

In the following code they have used "base" variant, But now i need to implement the same using "Grid" variant.

How to achieve "Grid" Variant ?

Ref: https://www.lightningdesignsystem.com/components/trees/?state=expanded&variant=grid

Component:

<aura:component>
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:attribute name="items" type="Object"/>
    <lightning:tree items="{! v.items }" header="Roles"/>
</aura:component>

JS:

({
    doInit: function (cmp, event, helper) {
    var items = [{
            "label": "Western Sales Director",
            "name": "1",
            "expanded": true,
            "items": [{
                "label": "Western Sales Manager",
                "name": "2",
                "expanded": true,
                "items" :[{
                    "label": "CA Sales Rep",
                    "name": "3",
                    "expanded": true,
                    "items" : []
                },{
                    "label": "OR Sales Rep",
                    "name": "4",
                    "expanded": true,
                    "items" : []
                }]
            }]
        }, {
            "label": "Eastern Sales Director",
            "name": "5",
            "expanded": false,
            "items": [{
                "label": "Easter Sales Manager",
                "name": "6",
                "expanded": true,
                "items" :[{
                    "label": "NY Sales Rep",
                    "name": "7",
                    "expanded": true,
                    "items" : []
                }, {
                    "label": "MA Sales Rep",
                    "name": "8",
                    "expanded": true,
                    "items" : []
                }]
            }]
        }];
        cmp.set('v.items', items);
    }     
})
0

This is not yet implemented in the Lightning Component System. By the time that salesforce.com finishes implementing all the components, it will most likely be available as a lightning:treeGrid or something like that. For now, if you need it, you will have to build it yourself.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.