< Suite 6.3 Rolls Out Grid Keyboard Navigation, Custom HTML Content, and Ajax Helper

React Tree

Fully configurable React tree component of the leading-edge DHTMLX Suite UI library. Evaluate advanced drag-n-drop, inline editing, and wide customization capabilities.

All Books
My Library
You can drag & drop books to your library

How It Works

Take 5 quick steps to create React Tree with DHTMLX:
1
Create a Tree.js file and import files and styles of Tree
2
Create Tree class, which extends the Component class
3
Add an empty container for Tree with the reference to it in the el property using the ref property
4
When the component is mounted, initialize Tree and attach the instance to the container with the reference to it in the el property
5
Specify a set of configuration properties if needed

Product Features

  • Cross-browser compatibility
  • Support for IE11+
  • Rich JavaScript API
  • Flexible customization
  • Data loading from JSON
  • Editable items (inline editing)
  • Keyboard navigation
  • Multiselection
  • Advanced drag-and-drop capabilities
  • Checkboxes (two/three states)
  • Custom folders
  • Dynamic data rendering

Why Choose DHTMLX React Tree Component?

Develop a feature-rich React tree widget
dhtmlxTree is intended to build intuitive hierarchical navigation interfaces for web apps. This UI library component includes dynamic data rendering, keyboard shortcuts, key navigation, and inline editing options. You can load data into the React.js tree component in the JSON format from an external file or a local data source.
Modify your React tree with a rich API
Benefit from configuring the behavior and appearance of your React UI tree via API technology. You can add checkboxes to tree elements and manage them: enable or disable, check or uncheck items you want. A fully functional drag-n-drop allows rearranging elements on the fly while saving items dragged from an original tree.
Adapt the UI of your React tree component
Comprehensive customization allows shifting every facet of the look and feel of your React Material UI tree component. You can add self-made CSS classes with the styling that would match your web app specifications. The default icon used for tree items can be replaced with a custom folder.
Use Angular and Vue.js wrappers
DHTMLX Suite widgets are compatible with the most popular frameworks used for developing web apps. Apart from the React tree library, you can evaluate the performance of our UI components when building Angular and Vue.js solutions. dhtmlxSuite trial is completely free to download and use within 30 days.

Support & Learning Resources

We provide comprehensive documentation with technical samples. Moreover, our dedicated support team is fast and qualified. Find the suitable way to get support:

dhtmlxTree Licensing

Free GNU GPL v2 Commercial Enterprise Ultimate
License Terms
Free GNU GPL v2
Commercial
Enterprise
Ultimate
Developers
Free GNU GPL v2
Commercial
5
Enterprise
20
Ultimate
Projects
Free GNU GPL v2
(open source only)
Commercial
1
Enterprise
5
Ultimate
SaaS
Free GNU GPL v2
Commercial
Enterprise
Ultimate
Perpetual distribution rights
Free GNU GPL v2
Commercial
Enterprise
Ultimate
Support Plan
Free GNU GPL v2
No Official Support
Commercial
Standard Support
Enterprise
Premium Support
Ultimate
Ultimate Support
Time Period
GNU GPL
Commercial
1 year
Enterprise
1 year
Ultimate
1 year
Updates
GNU GPL
Commercial
Minor & major updates
Bug fixes
Enterprise
Minor & major updates
Bug fixes
Ultimate
Minor & major updates
Bug fixes
Emergency bug fixes
Tickets
Free GNU GPL v2
Only Community Forum
Commercial
10
Enterprise
30
Ultimate
Response Time
GNU GPL
Commercial
72h
Enterprise
48h
Ultimate
24h
Personal Acccount Manager
GNU GPL
Commercial
Enterprise
Ultimate
Functionality
GNU GPL
Standard
Commercial
Professional
Enterprise
Professional
Ultimate
Professional
dhtmlxTree PRO
GNU GPL
Commercial
Enterprise
Ultimate
Module for XML parsing/serialization
GNU GPL
Commercial
Enterprise
Ultimate
demo-screenshot

File manager built with the help of Suite components: Layout, Grid, DataView, Toolbar, etc.

Up to 40% off

If you choose the whole Suite library instead
of buying DHTMLX UI components separately:

Suite Commercial - $799

Suite Enterprise - $1699

Suite Ultimate - $3499

Need help with dhtmlxTree integration into your app? Contact us