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 Jan 12 2021
1. Interactive Tree View For Vue.js 2 – VJstree
An interactive tree structure component for Vue.js 2 app.
2. Draggable Nested Tree Component For Vue
A draggable nested tree view component for Vue.js app.
3. Draggable Tree View Component For Vue.js 2
A Vue.js 2 component for creating a draggable tree view where the users are able to re-sort the nodes via drag and drop.
4. Tree Chart Component For Vue.js 2+
A Vue.js 2 component to render a tree chart from JSON data.
5. Liquor Tree Component For Vue.js
A Vue tree component that allows you to present hierarchically organized data in a nice and logical manner.
6. Treeview Component For Vue.js 2 – v-treeview
A treeview component for Vue.js 2 that supports customizable context menu and tree types, configurable font awesome icon, depth control.
7. Vue Folder Tree Component
A Vue treeview component used for rendering a dynamic, collapsible folder tree.
8. Organization Tree Component For Vue.js 2.x
A dynamic, expandable, horizontal/vertical organization tree component for Vue.js 2.x.
9. Vue.js Tree List Component
A vue component for tree structure that supports adding live editing and dragging/sorting.
10. 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.
Conclusion:
If you’re looking for more Vue.js components for creating tree views on the web app, check out our Tree View section.