ExpandAll not working. How can I programatically expand a tree node in Vue?

[Adam Moroff]

Hello

Im trying to expand a specific node in the treeview.  This is the code Im using but I cant seem to expand the node prgramatically.  Does anybody have an example of how to do this with Vue? Thanks.

Template

-----

<ejs-treeview

id="treeview"

ref="treeview"

:fields="fields"

@nodeClicked="nodeClicked"

></ejs-treeview>

Script

-----

console.log('get tree data')

let node = this.$refs.treeview.getNode('sec_1')

console.log(node)

console.log('expanding node ' + node.id)

this.$refs.treeview.expandAll([node.id])

Console

-----

get tree data

{id: "sec_1", text: "section1", parentID: null, selected: false, expanded: false, …}expanded: falsehasChildren: trueid: "sec_1"isChecked: nullparentID: nullselected: falsetext: "section1" notexpanding node sec_1

[Vinoth Kumar Sundara Moorthy]

Hi Adam, 

 

Thank you for contacting Syncfusion support. 

 

We have validated your query. You can programmatically expand a node via any of the following methods 

 

1.       Using expandAll method 

 

2.       Using expandedNodes property 

 

3.       By mapping expanded: true while field declaration 

 

We have prepared a sample to expand nodes programmatically in the nodeClicked event of the TreeView. 

 

Code Example 

nodeClicked: function(args) { 

    var node = this.$refs.tree1.getNode(args.node); 

    console.log(node); 

    //expand the nodes 

    this.$refs.tree1.expandAll([node.id]); 

    console.log("expanding node " + node.id); 

    // uncomment this to expand the selected node alone 

    // this.$refs.tree1.expandedNodes = [node.id] 

} 

 

Sample Link: https://codesandbox.io/s/vue-template-ttjsu 

 

Could you please check the above sample and get back to us if you need any further assistance? 

 

Regards, 

Vinoth Kumar S