1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
| <template>
| <div class="menu-list">
| <vol-item-menu :onOpenChange="onOpenChange" :onSelect="onSelect" :trees="arrayToTree()" :theme="theme"></vol-item-menu>
| </div>
| </template>
| <script>
| import VolItemMenu from "@/components/basic/VolItemMenu.vue";
|
| export default {
| components: {
| VolItemMenu
| },
| props: {
| options: {
| type: Array,
| default: []
| },
| onSelect: {
| type: Function,
| default: x => {
| console.log(x);
| }
| },
| onOpenChange: {
| type: Function,
| default: x => {
| console.log(x);
| }
| },
| theme: { type: String, default: "light" /*light,dark */ }
| },
| methods: {
| convertTree(root, source) {
| var subItems = source.filter(x => {
| return x.parentId == root.id;
| });
| if (subItems.length > 0) {
| root.children = [];
| root.children.push(...subItems);
| root.children.forEach(element => {
| this.convertTree(element, source);
| });
| }
| },
| arrayToTree() {
| // var menuData = [
| // { id: 1, name: "iview组件", parentId: 0,icon:'ios-aperture' }
| // ];
|
| var basicRoot = this.options.filter(x => {
| return x.parentId == 0;
| });
| basicRoot.forEach(x => {
| return this.convertTree(x, this.options);
| });
|
| return basicRoot;
| }
| },
| data() {
| return {};
| }
| };
| </script>
|
|
