10 Best Vue.js Tree View Components

Find the best Vue.js tree view component for your project with this list of 10 popular and well-maintained options. Tree views are a great way to visualize hierarchical data.

Vue Treeselect

A multi-select component with nested options support for Vue.js

"Vue Treeselect"

Features

Single & multiple select with nested options support
Fuzzy matching
Async searching
Delayed loading (load data of deep level options only when needed)
Keyboard support (navigate using Arrow Up & Arrow Down keys, select option using Enter key, etc.)
Rich options & highly customizable
Supports a wide range of browsers (see below)
RTL support

View on GitHub

Vue Treeselect

A Tree Select Plugin For Vue2.0+ http://zdy1988.github.io/vue-treeselect
This Plugin is based on vue-jstree, Some “props” can be used for reference !

"Vue Treeselect"

View on GitHub

Vue Jstree

A Tree Plugin For Vue2.0+ http://zdy1988.github.io/vue-jstree

"Vue Jstree"

View on GitHub

Vue.D3.tree

Vue component to display tree based on D3.js layout https://david-desmaisons.github.io/Vue.D3.tree/tree

"Vue.D3.tree"

View on GitHub

Vue Tree

tree and multi-select component based on Vue.js 2.0 https://github.com/halower/vue2-tree/blob/master/README.md

"Vue Tree"

View on GitHub

Vue Drag Tree

a Vue’s drag and drop tree component || 🌾Demo https://vigilant-curran-d6fec6.netlify.com/#/
It’s a tree components(Vue2.x) that allow you to drag and drop the node to exchange their data .

"Vue Drag Tree"

Feature

Double click on an node to turn it into a folder
Drag and Drop the tree node, even between two different levels
Customize your node (how to display node. eg: node name and left icon )
Controls whether a particular node can be dragged and whether the node can be plugged into other nodes
Append/Remove Node in any level (#TODO)

View on GitHub