TreeView Icons

The TreeView provides the option to add an icon for each node in the component. To render an icon you need to:

• Set a value for the iconField property.
• Once the iconField is set, use its value as a property in the definition of each node for which you want to display an icon.

If the value of the iconField is set to myIcon the data passed to the TreeView should look similar to the following; each node definition has a myIcon property that receives an icon.

Copy Codeconst tree = [
  {
    text: "My Documents",
    myIcon: starIcon,
    expanded: true,
    items: [
      {
        text: "KendoReact Project",
        myIcon: xIcon,
        expanded: true,
        items: [
          {
            text: "about.html",
            myIcon: imageIcon,
          },
          .............

The following example demonstrates how to use the iconField property:

Suggested Links

• TreeView Custom Rendering
• API Reference of the TreeView