how do i invoke component methods in reactjs?

[Christopher Hui]

For example, how do I use refresh for the ejTreeView?

https://help.syncfusion.com/api/js/ejtreeview#methods:refresh

How would I do this with a ReactJS component?

[Balamurugan P]

Hi Christopher, 

Thanks for using Syncfusion Products.  

In ReactJS, you can call the “refresh” method of TreeView as specified in below code block. 

Code block: 

var DefaultTree = React.createClass({ 

    onRefresh: function (e) { 

             //$("#treeview").ejTreeView("refresh"); 

              var treeObj = $('#treeview').data("ejTreeView"); 

              treeObj.refresh(); 

    }, 

       onRemove: function(e){ 

              var treeObj = $('#treeview').data("ejTreeView"); 

              treeObj.removeAll(); 

       }, 

    render: function () { 

        return (    

        <div id="treeview-default">   

           <EJ.Button id="btnRefresh" size="medium" type="button" height={30} width={150} text="Refresh Tree" click={this.onRefresh}> 

           </EJ.Button>  

           <EJ.Button id="btnRemove" size="medium" type="button" height={30} width={150} text="Remove Tree" click={this.onRemove}> 

           </EJ.Button>  

           <EJ.TreeView id="treeview" fields={fields}> 

           </EJ.TreeView> 

        </div> 

        ); 

    } 

});   

 

ReactDOM.render(<DefaultTree />, 

       document.getElementById('treeview-default') 

); 

We have prepared a sample based on this and you can find the sample under the following location: 

Sample : http://www.syncfusion.com/downloads/support/forum/128901/ze/ReactJS-524723283  

Currently we have provided getting started details in our RectJS document.  Also, we have planned to update the document with further details in our upcoming release.  

ReactJS document link: https://help.syncfusion.com/reactjs/overview  

Please let us know if you require any further assistance. 

 

Regards, 

Balamurugan P