DevExtreme v24.2 is now available.

Explore our newest features/capabilities and share your thoughts with us.

Your search did not match any results.

React Tree List - Simple Array: Hierarchical Structure

To bind the TreeList to a hierarchical array, do the following:

  1. Assign the array to the dataSource property.

  2. Set the dataStructure property to "tree".

  3. Use the itemsExpr property to specify the data field that contains nested items.

  4. If each data item has a Boolean field that specifies whether this data item nests other items, assign the field's name to the hasItemsExpr property. The TreeList uses this information to render the expand button. This is required only if the UI component is bound to a remote data source.

To give you the ability to edit code on the fly, the demo uses SystemJS. For this reason, launching the demo takes some time. We strongly recommend that you do not use this approach in real projects.
Backend API