1.0.6 • Published 3 years ago
vue-quick-tree v1.0.6
Vue Quick Tree
A simple, straightforward and mostly unopininoted tree vue component.
Installation
npm i vue-quick-tree
In your main.ts file
import VueQuickTree from 'vue-quick-tree'
Vue.component('vue-quick-tree', VueQuickTree)
Usage
<template>
<vue-quick-tree v-model="tree">
<template #node="{ node }">
<span v-if="node.type === 'folder'">📁 {{ node.name }}</span>
<span v-else>{{ node.name }}</span>
</template>
</vue-quick-tree>
</template>
<script>
export default {
data() {
return {
tree: [
{
name: 'stuff'
type: 'folder'
children: [],
validator: (dropLocation, dragLocation) => {}
}
]
}
}
}
</script>
Props
Name | Type | Description |
---|---|---|
indentLevel | number | indent size of the node |
border | BorderConfig (see below) | indent line style |
allowDragNDrop | boolean | determines if drag n drop will enabled |
// BorderConfig
{
show: boolean;
type: 'dashed' | 'solid';
color: string;
width: number;
}
The expected structure is a recursive array. Feel free to add any thing property you want to add into the object.
Note: The children property is required to have the nested structure
1.0.6
3 years ago
1.0.5
3 years ago
1.0.2
3 years ago
1.0.4
3 years ago
1.0.3
3 years ago
1.0.1
3 years ago
1.0.0
3 years ago
0.1.14
3 years ago
0.1.15
3 years ago
0.1.20
3 years ago
0.1.21
3 years ago
0.1.22
3 years ago
0.1.16
3 years ago
0.1.17
3 years ago
0.1.18
3 years ago
0.1.19
3 years ago
0.1.10
3 years ago
0.1.11
3 years ago
0.1.12
3 years ago
0.1.13
3 years ago
0.1.2
3 years ago
0.1.8
3 years ago
0.1.7
3 years ago
0.1.9
3 years ago
0.1.4
3 years ago
0.1.3
3 years ago
0.1.6
3 years ago
0.1.5
3 years ago
0.1.1
3 years ago
0.1.0
3 years ago