Commit 6ed0cd73772a2e0a5b7f2923df0734f38053d5d0
1 parent
0e316183
update Tree demo
Showing
1 changed file
with
33 additions
and
32 deletions
Show diff stats
examples/routers/tree.vue
1 | 1 | <template> |
2 | - <Tree :data="db" show-checkbox></Tree> | |
2 | + <div> | |
3 | + <Tree :data="baseData" show-checkbox></Tree> | |
4 | + <Button @click="handleAdd">add</Button> | |
5 | + <Button @click="handleUpdate">update</Button> | |
6 | + </div> | |
3 | 7 | </template> |
4 | 8 | <script> |
5 | 9 | export default { |
6 | 10 | data () { |
7 | 11 | return { |
8 | - db:[ | |
12 | + baseData: [ | |
9 | 13 | { |
10 | - title: '父级', | |
11 | - checked: false, | |
14 | + expand: true, | |
15 | + title: 'parent 1', | |
12 | 16 | children: [ |
13 | 17 | { |
14 | - title: '孩子', | |
15 | - checked: false, | |
18 | + title: 'parent 1-0', | |
19 | + expand: true, | |
20 | + disabled: true, | |
16 | 21 | children: [ |
17 | 22 | { |
18 | - title: '孙子', | |
19 | - checked: true | |
23 | + title: 'leaf', | |
24 | + disableCheckbox: true | |
20 | 25 | }, |
21 | 26 | { |
22 | - title: '孙子', | |
23 | - checked: false, | |
24 | - children: [ | |
25 | - { | |
26 | - title: '曾孙', | |
27 | - checked: false | |
28 | - } | |
29 | - ] | |
27 | + title: 'leaf', | |
30 | 28 | } |
31 | 29 | ] |
32 | - } | |
33 | - ] | |
34 | - }, | |
35 | - { | |
36 | - title: '其他', | |
37 | - checked: false, | |
38 | - children: [ | |
39 | - { | |
40 | - title: '其他孩子', | |
41 | - checked: true | |
42 | 30 | }, |
43 | 31 | { |
44 | - title: '其他孩子2', | |
45 | - checked: true | |
32 | + title: 'parent 1-1', | |
33 | + expand: true, | |
34 | + checked: true, | |
35 | + children: [ | |
36 | + { | |
37 | + title: '<span style="color: red">leaf</span>', | |
38 | + } | |
39 | + ] | |
46 | 40 | } |
47 | 41 | ] |
48 | 42 | } |
... | ... | @@ -50,10 +44,17 @@ |
50 | 44 | } |
51 | 45 | }, |
52 | 46 | methods: { |
53 | - | |
54 | - }, | |
55 | - mounted () { | |
56 | - | |
47 | + handleAdd () { | |
48 | + this.baseData.push( | |
49 | + { | |
50 | + title: 'test name', | |
51 | + checked: true | |
52 | + } | |
53 | + ) | |
54 | + }, | |
55 | + handleUpdate () { | |
56 | + this.$set(this.baseData[0].children[0], 'disabled', false); | |
57 | + } | |
57 | 58 | } |
58 | 59 | } |
59 | 60 | </script> | ... | ... |