Vue Dropdown Tree Select
Lightweight component for displaying hierarchical data < 15k 😎
Emits selections to parent component
Usage
npm i vue-dropdown-tree-select
<script setup>
import DropdownTreeSelect from 'vue-dropdown-tree-select';
import 'vue-dropdown-tree-select/dist/style.css';
const items = [
{ groupLabel: 'Frontend Developer',
children: [
{groupLabel: 'Vue',
children: [ { label:'Options Api', value: 'optionsApi'},
{ label: 'Composition Api', value: 'compositionApi' }]},
{ label: 'React', value: 'react'},
{ label: 'Angular', value: 'angular'}
]},
{ groupLabel: 'Backend Developer',
children: [
{label: 'Bun', value: 'bun' },
{ label: 'Deno', value: 'deno' },
{ label:'Node', value: 'node' }
]},
];
function handleChange(selections) {
//todo selections = [ {label '', value: ''}, .... ];
// console.log(selections);
}
</script>
<template>
<DropdownTreeSelect :items="items" @change-selections="handleChange"/>
</template
Contact
Feel free to ping me 💫
connect@giladshohat.com