Looking for a tree view UI component for your Vue.js based app to present data (e.g. files, JSON, folders, and any other hierarchical data) in a logical manner?
This is a list of 10 best Vue.js tree components that help developers quickly and easily render hierarchical data in a nested tree structure. Have fun.
Originally published Nov 17 2017, updated July 25 2025
1. Customizable Vuejs Tree Viewer
A highly customizable vuejs tree viewer for expanding/collapsing folder tree.
2. Draggable Nested Tree Component – he-tree-vue
A Vue.js component to render a nested tree view that allows you to resort nodes via drag and drop.
3. Vue-Tree
A Vue tree component optimized using virtual list. Supports tree display, single select, multiple select, search, dropdown, remote loading and drap-and-drop, etc.
4. Vue-Tree-Navigation
Vue.js tree navigation with vue-router support.
- unlimited number of levels
- optional vue-router support (v2.0.0 or higher)
- generate navigation items automatically from vue-router routes or define them manually
- define a default open level
- auto-open a level when a corresponding URL visited
- focused on core functionality, only necessary styles included
- elements are provided with meaningful classes to make customizations comfortable (for example
NavigationItem--active,NavigationLevel--level-1,NavigationLevel--closed)
5. OS X Finder Like Tree Component – vue-finder
A Vue 3 component to display hierarchical data (like the MacOS X finder).
6. Powerful Tree View Component – vue-tree
A simple yet full-featured and highly customizable tree view component for Vue.
Features:
- Works in modern browsers using the precompiled scripts, or can be included in your babel/webpack chain.
- Expandable nodes
- Checkboxes
- Radio buttons
- Node selection
- Addition and removal of nodes
- Slots for node content
- Skinning
- Asynchronous loading of child nodes
- Follows ARIA guidelines for treeview accessibility
- Drag and drop (single nodes, works between trees)
7. Collapsible & Checkable Tree Diagram In Vue – blocks-tree
A simple organization structure tree view based on Vue3.x. It supports events, slots, horizontal vision and nodes manipulation.
8. vue3-treeview
Vue 3 treeview component.
Features:
- Made with vue3
- Fully reactive
- Typings
- Normalized data (not deeply nested)
- Full composition API
- Lazy load
- Editable text
- Events for all actions
- Node slots
- Loading slot
- Keyboard navigation
- Checkboxes (auto / manual)
- Drag and drop
- Customizable style
- Customizable icons
9. vue3-tree-vue
A Simple vue3 project for rendering items in a tree.
10. vue-treeview
A simple treeview component for Vuejs Apps.
Conclusion:
If you’re looking for more Vue.js components for creating tree views on the web app, check out our Tree View section.