How to get the updated data source of TreeView after performing its any operation

How to get the updated data source of TreeView after performing its any operation. 

Solution:

In our TreeView component, we have provided the method getTreeData to retrieve the updated data source of TreeView after performing operations such as drag and drop, node editing, node selecting/unselecting, node expanding/collapsing, node checking/unchecking and adding or removing node.

• If you pass the ID of the TreeView node as an arguments for this method, then it will return the updated data source of the corresponding node. Otherwise, it will return the entire updated data source of TreeView.
• The updated data source also contains custom attributes, if you specified in the data source.

Refer the below code block:

   
 // Render the TreeView with checkboxes
    let treeObj: TreeView = new TreeView({
        fields: { dataSource: (dataSource as any).checkboxData, id: 'id', parentID: 'pid', text: 'name', hasChildren: 'hasChild' },
        showCheckBox: true,
        nodeChecked: nodeChecked
    });
    treeObj.appendTo('#tree');
 
  function nodeChecked(args: NodeCheckEventArgs) {
    //Create the instance for tree 
    var tree = (document.getElementById('tree') as any).ej2_instances[0]; 
    //Get the checked Nodes id 
    var checkedNodes = tree.checkedNodes; 
    var checkedNodesData = []; 
    //Get checked Nodes Data 
    for (var i = 0; i < checkedNodes.length; i++) { 
      checkedNodesData.push(JSON.stringify(tree.getTreeData(checkedNodes[i]))); 
    } 
    console.log(checkedNodesData); 
  }
 

Refer to the below links to learn more about the Syncfusion TreeView control.

Documentation: https://ej2.syncfusion.com/documentation/treeview/getting-started/

API reference: https://ej2.syncfusion.com/documentation/api/treeview/

Live demo: https://ej2.syncfusion.com/demos/#/material/treeview/default.html