← All projects

vue3-router-tree

by @boussadjra

34

Tree that represents the routes structure

About this project

Vue 3 router tree This component is based on Vue.js 3, it represents your routes or items as a tree view, by default takes it takes the routes configuration as items, but you could provide your custom items that respects the following format : You could also add any other field that you need it when you want to customize the items rendering Demo LIVE DEMO or you could check this boilerplate on codesandbox Installation npm install vue3-router-tree --save Usage With router : with custom items : props : Name default description ------------- --------- ----------------------------------------------------------------------------------------------- items [] the tree items or if not provided the component renders the current available routes active-color "#5d1df1" the color of the active sub node default-open '' specify the default opened path exclude-field '' In your route config you could specify a field inside meta option which will be used to exclude open-all '' Expand all items that have children slots : Name description ---- ----------------------------------- item override the default item rendering

From the project README on GitHub

Stars
34
Forks
6
Last push
10 Jan 2021

Add this badge to your README

Show that your project is listed on Made in Algeria.

Made in Algeria
[![Made in Algeria](https://www.madeinalgeria.dev/badge/vue3-router-tree.svg)](https://www.madeinalgeria.dev/projects/vue3-router-tree)

Related projects