Commit e6e970352deab34421f3a978449c765adbba7ce2

Authored by 梁灏
1 parent 68b308ee

fixed bug under Vue 2.4.1

examples/routers/cascader.vue
1 -<!--<template>-->  
2 - <!--<Row>-->  
3 - <!--<i-col span="4">-->  
4 - <!--<Button @click="handleLoad">load</Button>-->  
5 - <!--{{ v1 }}-->  
6 - <!--</i-col>-->  
7 - <!--<i-col span="4">-->  
8 - <!--<Cascader :data="data2" filterable v-model="v1" style="width: 200px;"></Cascader>-->  
9 - <!--&lt;!&ndash;<Cascader :data="data2" filterable v-model="v1" :loadData="loadData"></Cascader>&ndash;&gt;-->  
10 - <!--</i-col>-->  
11 - <!--</Row>-->  
12 -<!--</template>-->  
13 -<!--<script>-->  
14 - <!--export default {-->  
15 - <!--data () {-->  
16 - <!--return {-->  
17 - <!--v1: [],-->  
18 - <!--data2: [-->  
19 - <!--{-->  
20 - <!--value: 'zhejiang',-->  
21 - <!--label: '浙江',-->  
22 - <!--children: [],-->  
23 - <!--loading: false-->  
24 - <!--},-->  
25 - <!--{-->  
26 - <!--value: 'jiangsu',-->  
27 - <!--label: '江苏',-->  
28 - <!--children: [{-->  
29 - <!--value: 'nanjing',-->  
30 - <!--label: '南京',-->  
31 - <!--children: [-->  
32 - <!--{-->  
33 - <!--value: 'zhonghuamen',-->  
34 - <!--label: '中华门'-->  
35 - <!--},-->  
36 - <!--{-->  
37 - <!--value: 'v1',-->  
38 - <!--label: 'v111'-->  
39 - <!--},-->  
40 - <!--{-->  
41 - <!--value: 'v2',-->  
42 - <!--label: 'v2222'-->  
43 - <!--},-->  
44 - <!--{-->  
45 - <!--value: 'v3',-->  
46 - <!--label: 'v333'-->  
47 - <!--},-->  
48 - <!--{-->  
49 - <!--value: 'v4',-->  
50 - <!--label: 'v4444'-->  
51 - <!--},-->  
52 - <!--{-->  
53 - <!--value: 'v5',-->  
54 - <!--label: 'v555'-->  
55 - <!--},-->  
56 - <!--{-->  
57 - <!--value: 'v6',-->  
58 - <!--label: 'v666'-->  
59 - <!--},-->  
60 - <!--{-->  
61 - <!--value: 'v7',-->  
62 - <!--label: 'v777'-->  
63 - <!--}-->  
64 - <!--]-->  
65 - <!--}]-->  
66 - <!--}-->  
67 - <!--],-->  
68 - <!--data3: [{-->  
69 - <!--value: 'beijing',-->  
70 - <!--label: '北京',-->  
71 - <!--children: [-->  
72 - <!--{-->  
73 - <!--value: 'gugong',-->  
74 - <!--label: '故宫'-->  
75 - <!--},-->  
76 - <!--{-->  
77 - <!--value: 'tiantan',-->  
78 - <!--label: '天坛'-->  
79 - <!--},-->  
80 - <!--{-->  
81 - <!--value: 'wangfujing',-->  
82 - <!--label: '王府井'-->  
83 - <!--}-->  
84 - <!--]-->  
85 - <!--}, {-->  
86 - <!--value: 'jiangsu',-->  
87 - <!--label: '江苏',-->  
88 - <!--children: [-->  
89 - <!--{-->  
90 - <!--value: 'nanjing',-->  
91 - <!--label: '南京',-->  
92 - <!--children: [-->  
93 - <!--{-->  
94 - <!--value: 'fuzimiao',-->  
95 - <!--label: '夫子庙',-->  
96 - <!--}-->  
97 - <!--]-->  
98 - <!--},-->  
99 - <!--{-->  
100 - <!--value: 'suzhou',-->  
101 - <!--label: '苏州',-->  
102 - <!--children: [-->  
103 - <!--{-->  
104 - <!--disabled: true,-->  
105 - <!--value: 'zhuozhengyuan',-->  
106 - <!--label: '拙政园',-->  
107 - <!--},-->  
108 - <!--{-->  
109 - <!--value: 'shizilin',-->  
110 - <!--label: '狮子林',-->  
111 - <!--}-->  
112 - <!--]-->  
113 - <!--}-->  
114 - <!--],-->  
115 - <!--}]-->  
116 - <!--}-->  
117 - <!--},-->  
118 - <!--methods: {-->  
119 - <!--handleLoad () {-->  
120 - <!--this.data2[0].loading = !this.data2[0].loading;-->  
121 - <!--},-->  
122 - <!--loadData (item, cb) {-->  
123 - <!--item.loading = true;-->  
124 - <!--setTimeout(() => {-->  
125 - <!--if (item.value === 'zhejiang') {-->  
126 - <!--item.children = [-->  
127 - <!--{-->  
128 - <!--value: 'hangzhou',-->  
129 - <!--label: '杭州',-->  
130 - <!--loading: false,-->  
131 - <!--children: []-->  
132 - <!--}-->  
133 - <!--];-->  
134 - <!--} else if (item.value === 'hangzhou') {-->  
135 - <!--item.children = [-->  
136 - <!--{-->  
137 - <!--value: 'ali',-->  
138 - <!--label: '阿里巴巴'-->  
139 - <!--}-->  
140 - <!--];-->  
141 - <!--}-->  
142 - <!--item.loading = false;-->  
143 - <!--cb();-->  
144 - <!--}, 1000);-->  
145 - <!--}-->  
146 - <!--}-->  
147 - <!--}-->  
148 -<!--</script>-->  
149 -  
150 -<!--<template>-->  
151 - <!--<Cascader :data="data4" :load-data="loadData"></Cascader>-->  
152 -<!--</template>-->  
153 -<!--<script>-->  
154 - <!--export default {-->  
155 - <!--data () {-->  
156 - <!--return {-->  
157 - <!--data4: [-->  
158 - <!--{-->  
159 - <!--value: 'beijing',-->  
160 - <!--label: '北京',-->  
161 - <!--children: [],-->  
162 - <!--loading: false-->  
163 - <!--},-->  
164 - <!--{-->  
165 - <!--value: 'hangzhou',-->  
166 - <!--label: '杭州',-->  
167 - <!--children: [],-->  
168 - <!--loading:false-->  
169 - <!--}-->  
170 - <!--]-->  
171 - <!--}-->  
172 - <!--},-->  
173 - <!--methods: {-->  
174 - <!--loadData (item, callback) {-->  
175 - <!--item.loading = true;-->  
176 - <!--setTimeout(() => {-->  
177 - <!--if (item.value === 'beijing') {-->  
178 - <!--item.children = [-->  
179 - <!--{-->  
180 - <!--value: 'talkingdata',-->  
181 - <!--label: 'TalkingData'-->  
182 - <!--},-->  
183 - <!--{-->  
184 - <!--value: 'baidu',-->  
185 - <!--label: '百度'-->  
186 - <!--},-->  
187 - <!--{-->  
188 - <!--value: 'sina',-->  
189 - <!--label: '新浪'-->  
190 - <!--}-->  
191 - <!--];-->  
192 - <!--} else if (item.value === 'hangzhou') {-->  
193 - <!--item.children = [-->  
194 - <!--{-->  
195 - <!--value: 'ali',-->  
196 - <!--label: '阿里巴巴'-->  
197 - <!--},-->  
198 - <!--{-->  
199 - <!--value: '163',-->  
200 - <!--label: '网易'-->  
201 - <!--}-->  
202 - <!--];-->  
203 - <!--}-->  
204 - <!--item.loading = false;-->  
205 - <!--callback();-->  
206 - <!--}, 1000);-->  
207 - <!--}-->  
208 - <!--}-->  
209 - <!--}-->  
210 -<!--</script>-->  
211 -  
212 -  
213 -  
214 <template> 1 <template>
215 - <!--<Cascader :data="data4" :load-data="loadData" style="width: 200px;"></Cascader>-->  
216 - <div>  
217 - <Cascader :data="data" v-model="model" :load-data="loadData"></Cascader>  
218 - <ul>  
219 - <li v-for="(log, idx) in logs" :key="idx">{{log}}</li>  
220 - </ul>  
221 - </div> 2 + <Cascader v-model="value3" :data="data" filterable></Cascader>
222 </template> 3 </template>
223 <script> 4 <script>
224 export default { 5 export default {
225 data () { 6 data () {
226 return { 7 return {
227 - data4: [  
228 - {  
229 - value: 'beijing',  
230 - label: '北京',  
231 - children: [],  
232 - loading: false  
233 - },  
234 - {  
235 - value: 'hangzhou',  
236 - label: '杭州',  
237 - children: [],  
238 - loading:false  
239 - }  
240 - ],  
241 - data: [],  
242 - model: [340000, 340100, 340104],  
243 - count: 1,  
244 - logs: [] 8 + data: [{
  9 + value: 'beijing',
  10 + label: '北京',
  11 + children: [
  12 + {
  13 + value: 'gugong',
  14 + label: '故宫'
  15 + },
  16 + {
  17 + value: 'tiantan',
  18 + label: '天坛'
  19 + },
  20 + {
  21 + value: 'wangfujing',
  22 + label: '王府井'
  23 + }
  24 + ]
  25 + }, {
  26 + value: 'jiangsu',
  27 + label: '江苏',
  28 + children: [
  29 + {
  30 + value: 'nanjing',
  31 + label: '南京',
  32 + children: [
  33 + {
  34 + value: 'fuzimiao',
  35 + label: '夫子庙',
  36 + }
  37 + ]
  38 + },
  39 + {
  40 + value: 'suzhou',
  41 + label: '苏州',
  42 + children: [
  43 + {
  44 + value: 'zhuozhengyuan',
  45 + label: '拙政园',
  46 + },
  47 + {
  48 + value: 'shizilin',
  49 + label: '狮子林',
  50 + }
  51 + ]
  52 + }
  53 + ],
  54 + }],
  55 + value3: []
245 } 56 }
246 - },  
247 - methods: {  
248 - loadData (item, callback) {  
249 - this.logs.push(`第${this.count}次请求: ${item.value}`)  
250 - this.count++  
251 - item.loading = true;  
252 - setTimeout(() => {  
253 - if (item.value === 340000) {  
254 - item.children = [  
255 - {value: 340100, label: "合肥市", children: [], loading: false}  
256 - ];  
257 - } else if (item.value === 340100) {  
258 - item.children = [  
259 - {value: 340104, label: "蜀山区"},  
260 - {value: 340111, label: "包河区"}  
261 - ];  
262 - }  
263 - item.loading = false;  
264 - callback();  
265 - }, 1000);  
266 - }  
267 - },  
268 - mounted() {  
269 - this.data = [{value: 340000, label: "安徽省", children: [], loading: false}];  
270 } 57 }
271 } 58 }
272 </script> 59 </script>
273 -  
src/components/cascader/caspanel.vue
@@ -3,7 +3,7 @@ @@ -3,7 +3,7 @@
3 <ul v-if="data && data.length" :class="[prefixCls + '-menu']"> 3 <ul v-if="data && data.length" :class="[prefixCls + '-menu']">
4 <Casitem 4 <Casitem
5 v-for="item in data" 5 v-for="item in data"
6 - :key="item" 6 + :key="getKey()"
7 :prefix-cls="prefixCls" 7 :prefix-cls="prefixCls"
8 :data="item" 8 :data="item"
9 :tmp-item="tmpItem" 9 :tmp-item="tmpItem"
@@ -17,6 +17,8 @@ @@ -17,6 +17,8 @@
17 import Emitter from '../../mixins/emitter'; 17 import Emitter from '../../mixins/emitter';
18 import { findComponentUpward } from '../../utils/assist'; 18 import { findComponentUpward } from '../../utils/assist';
19 19
  20 + let key = 1;
  21 +
20 export default { 22 export default {
21 name: 'Caspanel', 23 name: 'Caspanel',
22 mixins: [ Emitter ], 24 mixins: [ Emitter ],
@@ -109,6 +111,9 @@ @@ -109,6 +111,9 @@
109 } else { 111 } else {
110 this.$parent.$parent.updateResult(result); 112 this.$parent.$parent.updateResult(result);
111 } 113 }
  114 + },
  115 + getKey () {
  116 + return key++;
112 } 117 }
113 }, 118 },
114 mounted () { 119 mounted () {