Commit 69a10b78f7f820c0e1bbefc36d4b4d2431efaab0
1 parent
05e2dda0
fixed #787
Showing
3 changed files
with
138 additions
and
49 deletions
Show diff stats
examples/routers/tree.vue
1 | 1 | <template> |
2 | - <Tree :data="baseData" @on-check-change="handleSelectChange" show-checkbox></Tree> | |
2 | + <Tree :data="baseData" show-checkbox @on-check-change="handleChange" ></Tree> | |
3 | 3 | </template> |
4 | 4 | <script> |
5 | 5 | export default { |
... | ... | @@ -8,55 +8,30 @@ |
8 | 8 | bd: [], |
9 | 9 | baseData: [ |
10 | 10 | { |
11 | + title: 'parent', | |
12 | + id: '1-0', | |
11 | 13 | expand: true, |
12 | - title: 'parent 1', | |
13 | - children: [{ | |
14 | - title: 'parent 1-0', | |
15 | - expand: true, | |
16 | -// disabled: true, | |
17 | -// checked: true, | |
18 | - children: [ | |
19 | - { | |
20 | - title: 'leaf', | |
21 | - checked: true, | |
22 | - selected: true | |
23 | - }, | |
24 | - { | |
25 | - title: 'leaf', | |
26 | - checked: false | |
27 | - } | |
28 | - ] | |
29 | - }, { | |
30 | - title: 'parent 1-1', | |
31 | - expand: true, | |
32 | - checked: true, | |
33 | - children: [ | |
34 | - { | |
35 | - title: '<span style="color: red">leaf</span>', | |
36 | - checked: false | |
37 | - } | |
38 | - ] | |
39 | - }] | |
40 | - }, | |
41 | - { | |
42 | - expand: true, | |
43 | - title: 'parent 1', | |
44 | - children: [{ | |
45 | - title: 'parent 1-0', | |
46 | - expand: true, | |
47 | - children: [{ | |
48 | - title: 'leaf' | |
49 | - }, { | |
50 | - title: 'leaf', | |
51 | - }] | |
52 | - }, { | |
53 | - title: 'parent 1-1', | |
54 | - expand: true, | |
55 | - checked: true, | |
56 | - children: [{ | |
57 | - title: '<span style="color: red">leaf</span>', | |
58 | - }] | |
59 | - }] | |
14 | + children: [ | |
15 | + { | |
16 | + title: 'child1', | |
17 | + id: '1-1', | |
18 | + expand: true, | |
19 | + children: [ | |
20 | + { | |
21 | + title: 'child1-1-1', | |
22 | + id: '1-1-1' | |
23 | + }, | |
24 | + { | |
25 | + title: 'child1-1-2', | |
26 | + id: '1-1-2' | |
27 | + } | |
28 | + ] | |
29 | + }, | |
30 | + { | |
31 | + title: 'child2', | |
32 | + id: '1-2' | |
33 | + } | |
34 | + ] | |
60 | 35 | } |
61 | 36 | ] |
62 | 37 | } |
... | ... | @@ -64,7 +39,18 @@ |
64 | 39 | methods: { |
65 | 40 | handleSelectChange (data) { |
66 | 41 | console.log(data); |
42 | + }, | |
43 | + updateTree (data) { | |
44 | + data[0].children[0].checked = true; | |
45 | +// data[0].children[0].children[0].checked = true; | |
46 | +// data[0].children[0].children[1].checked = true; | |
47 | + }, | |
48 | + handleChange () { | |
49 | + console.log(1) | |
67 | 50 | } |
51 | + }, | |
52 | + mounted () { | |
53 | + this.updateTree(this.baseData); | |
68 | 54 | } |
69 | 55 | } |
70 | 56 | </script> | ... | ... |
src/components/tree/tree.vue
... | ... | @@ -119,6 +119,14 @@ |
119 | 119 | this.$on('on-checked', () => { |
120 | 120 | this.$emit('on-check-change', this.getCheckedNodes()); |
121 | 121 | }); |
122 | + }, | |
123 | + watch: { | |
124 | + data () { | |
125 | + this.$nextTick(() => { | |
126 | + this.updateData(); | |
127 | + this.broadcast('TreeNode', 'indeterminate'); | |
128 | + }) | |
129 | + } | |
122 | 130 | } |
123 | 131 | }; |
124 | 132 | </script> |
125 | 133 | \ No newline at end of file | ... | ... |
1 | +export default { | |
2 | + i: { | |
3 | + select: { | |
4 | + placeholder: '選んでください', | |
5 | + noMatch: 'マッチするデータなし' | |
6 | + }, | |
7 | + table: { | |
8 | + noDataText: 'データなし', | |
9 | + noFilteredDataText: 'スクリーニングしたデータなし', | |
10 | + confirmFilter: 'スクリーニング', | |
11 | + resetFilter: 'リセット', | |
12 | + clearFilter: '全部' | |
13 | + }, | |
14 | + datepicker: { | |
15 | + selectDate: '日時を選んでください', | |
16 | + selectTime: '時間を選んでください', | |
17 | + startTime: 'スタート時間', | |
18 | + endTime: '終了時間', | |
19 | + clear: 'クリーア', | |
20 | + ok: '確定', | |
21 | + month: '月', | |
22 | + month1: '1 月', | |
23 | + month2: '2 月', | |
24 | + month3: '3 月', | |
25 | + month4: '4 月', | |
26 | + month5: '5 月', | |
27 | + month6: '6 月', | |
28 | + month7: '7 月', | |
29 | + month8: '8 月', | |
30 | + month9: '9 月', | |
31 | + month10: '10 月', | |
32 | + month11: '11 月', | |
33 | + month12: '12 月', | |
34 | + year: '年', | |
35 | + weeks: { | |
36 | + sun: '日', | |
37 | + mon: '月', | |
38 | + tue: '火', | |
39 | + wed: '水', | |
40 | + thu: '木', | |
41 | + fri: '金', | |
42 | + sat: '土' | |
43 | + }, | |
44 | + months: { | |
45 | + m1: '1月', | |
46 | + m2: '2月', | |
47 | + m3: '3月', | |
48 | + m4: '4月', | |
49 | + m5: '5月', | |
50 | + m6: '6月', | |
51 | + m7: '7月', | |
52 | + m8: '8月', | |
53 | + m9: '9月', | |
54 | + m10: '10月', | |
55 | + m11: '11月', | |
56 | + m12: '12月' | |
57 | + } | |
58 | + }, | |
59 | + transfer: { | |
60 | + titles: { | |
61 | + source: 'ソースリスト', | |
62 | + target: 'ターゲットリスト' | |
63 | + }, | |
64 | + filterPlaceholder: '検索内容を入力ください', | |
65 | + notFoundText: '内容が見つかってなかった' | |
66 | + }, | |
67 | + modal: { | |
68 | + okText: '確定', | |
69 | + cancelText: 'キャンセル' | |
70 | + }, | |
71 | + poptip: { | |
72 | + okText: '確定', | |
73 | + cancelText: 'キャンセル' | |
74 | + }, | |
75 | + page: { | |
76 | + prev: '前へ', | |
77 | + next: '次へ', | |
78 | + total: '全部', | |
79 | + item: '件', | |
80 | + items: '件', | |
81 | + prev5: '前の5ページへ', | |
82 | + next5: '次の5ページへ', | |
83 | + page: '件/ページ', | |
84 | + goto: '', | |
85 | + p: 'ページ目へ' | |
86 | + }, | |
87 | + rate: { | |
88 | + star: '点', | |
89 | + stars: '点' | |
90 | + }, | |
91 | + tree: { | |
92 | + emptyText: 'データなし' | |
93 | + } | |
94 | + } | |
95 | +}; | |
0 | 96 | \ No newline at end of file | ... | ... |