Commit 517917a2add70d9fdc55aa7894ca378acddae35d

Authored by 梁灏
1 parent e94e7643

add global setting $IVIEW

@@ -10,7 +10,10 @@ import iView from '../src/index'; @@ -10,7 +10,10 @@ import iView from '../src/index';
10 import locale from '../src/locale/lang/zh-CN'; 10 import locale from '../src/locale/lang/zh-CN';
11 11
12 Vue.use(VueRouter); 12 Vue.use(VueRouter);
13 -Vue.use(iView, { locale }); 13 +Vue.use(iView, {
  14 + locale,
  15 + transfer: true
  16 +});
14 17
15 // 开启debug模式 18 // 开启debug模式
16 Vue.config.debug = true; 19 Vue.config.debug = true;
examples/routers/select.vue
1 -<!--<template>-->  
2 - <!--<div>-->  
3 - <!--{{model10}} - -->  
4 - <!--{{model11}}-->  
5 - <!--<Select -->  
6 - <!--v-model="model10" -->  
7 - <!--style="width:260px">-->  
8 - <!--<Option -->  
9 - <!--v-for="(item, index) in cityList" -->  
10 - <!--:value="item.value" -->  
11 - <!--:key="index">{{item.label}}</Option>-->  
12 - <!--</Select>-->  
13 - <!--<Select -->  
14 - <!--v-model="model11" -->  
15 - <!--style="width:260px">-->  
16 - <!--<Option -->  
17 - <!--v-for="(item, index) in cityList" -->  
18 - <!--:value="item.value" -->  
19 - <!--:key="index">{{item.label}}</Option>-->  
20 - <!--</Select>-->  
21 - <!--</div>-->  
22 -<!--</template>-->  
23 -<!--<script>-->  
24 -<!--export default {-->  
25 - <!--data() {-->  
26 - <!--return {-->  
27 - <!--cityList: [],-->  
28 - <!--model10: '',-->  
29 - <!--model11: '',-->  
30 - <!--model12: '',-->  
31 - <!--};-->  
32 - <!--},-->  
33 - <!--mounted() {-->  
34 - <!--setTimeout(() => {-->  
35 - <!--this.cityList = [-->  
36 - <!--{-->  
37 - <!--value: 'beijing',-->  
38 - <!--label: '北京市',-->  
39 - <!--},-->  
40 - <!--{-->  
41 - <!--value: 'shanghai',-->  
42 - <!--label: '上海市',-->  
43 - <!--},-->  
44 - <!--{-->  
45 - <!--value: 'shenzhen',-->  
46 - <!--label: '深圳市',-->  
47 - <!--},-->  
48 - <!--{-->  
49 - <!--value: 'hangzhou',-->  
50 - <!--label: '杭州市',-->  
51 - <!--},-->  
52 - <!--{-->  
53 - <!--value: 'nanjing',-->  
54 - <!--label: '南京市',-->  
55 - <!--},-->  
56 - <!--{-->  
57 - <!--value: 'chongqing',-->  
58 - <!--label: '重庆市',-->  
59 - <!--},-->  
60 - <!--];-->  
61 - <!--}, 1000);-->  
62 - <!--},-->  
63 -<!--};-->  
64 -<!--</script>-->  
65 -  
66 -<!--<template>-->  
67 - <!--<div>-->  
68 - <!--<Select v-model="value">-->  
69 - <!--<Option -->  
70 - <!--v-for="item in list" -->  
71 - <!--:value="item.value" -->  
72 - <!--:label="item.label" -->  
73 - <!--:key="item.value"></Option>-->  
74 - <!--</Select>-->  
75 - <!--<Button @click="setList">set list</Button>-->  
76 - <!--</div>-->  
77 -<!--</template>-->  
78 -<!--<script>-->  
79 -<!--export default {-->  
80 - <!--data() {-->  
81 - <!--return {-->  
82 - <!--value: '',-->  
83 - <!--list: [],-->  
84 - <!--};-->  
85 - <!--},-->  
86 - <!--methods: {-->  
87 - <!--setList() {-->  
88 - <!--const list = [];-->  
89 - <!--for (let i = 0; i < 400; i++) {-->  
90 - <!--list.push({-->  
91 - <!--value: `value${i}`,-->  
92 - <!--label: `label${i}`,-->  
93 - <!--});-->  
94 - <!--}-->  
95 - <!--this.list = list;-->  
96 - <!--},-->  
97 - <!--},-->  
98 -<!--};-->  
99 -<!--</script>-->  
100 -  
101 -<!--<template>-->  
102 - <!--<div style="width: 400px;margin: 50px;">-->  
103 - <!--<div>data: {{model13}}</div>-->  
104 - <!--<Row>-->  
105 - <!--<Col -->  
106 - <!--span="12" -->  
107 - <!--style="padding-right:10px">-->  
108 - <!--<Select-->  
109 - <!--v-model="model13"-->  
110 - <!--:remote-method="remoteMethod1"-->  
111 - <!--:loading="loading1"-->  
112 - <!--size="small"-->  
113 - <!--placeholder="提示提示"-->  
114 - <!--filterable-->  
115 - <!--remote-->  
116 - <!--transfer>-->  
117 - <!--<Option -->  
118 - <!--v-for="(option, index) in options1" -->  
119 - <!--:value="option.value" -->  
120 - <!--:key="index">{{option.label}}</Option>-->  
121 - <!--</Select>-->  
122 -<!--</Col>-->  
123 - <!--<Col span="12">-->  
124 - <!--<Select-->  
125 - <!--v-model="model14"-->  
126 - <!--:remote-method="remoteMethod2"-->  
127 - <!--:loading="loading2"-->  
128 - <!--multiple-->  
129 - <!--filterable-->  
130 - <!--remote>-->  
131 - <!--<Option -->  
132 - <!--v-for="(option, index) in options2" -->  
133 - <!--:value="option.value" -->  
134 - <!--:key="index">{{option.label}}</Option>-->  
135 - <!--</Select>-->  
136 -<!--</Col>-->  
137 - <!--</Row>-->  
138 - <!--</div>-->  
139 -<!--</template>-->  
140 -<!--<script>-->  
141 -<!--export default {-->  
142 - <!--data() {-->  
143 - <!--return {-->  
144 - <!--model13: '',-->  
145 - <!--loading1: false,-->  
146 - <!--options1: [],-->  
147 - <!--model14: [],-->  
148 - <!--loading2: false,-->  
149 - <!--options2: [],-->  
150 - <!--list: [-->  
151 - <!--'Alabama',-->  
152 - <!--'Alaska',-->  
153 - <!--'Arizona',-->  
154 - <!--'Arkansas',-->  
155 - <!--'California',-->  
156 - <!--'Colorado',-->  
157 - <!--'Connecticut',-->  
158 - <!--'Delaware',-->  
159 - <!--'Florida',-->  
160 - <!--'Georgia',-->  
161 - <!--'Hawaii',-->  
162 - <!--'Idaho',-->  
163 - <!--'Illinois',-->  
164 - <!--'Indiana',-->  
165 - <!--'Iowa',-->  
166 - <!--'Kansas',-->  
167 - <!--'Kentucky',-->  
168 - <!--'Louisiana',-->  
169 - <!--'Maine',-->  
170 - <!--'Maryland',-->  
171 - <!--'Massachusetts',-->  
172 - <!--'Michigan',-->  
173 - <!--'Minnesota',-->  
174 - <!--'Mississippi',-->  
175 - <!--'Missouri',-->  
176 - <!--'Montana',-->  
177 - <!--'Nebraska',-->  
178 - <!--'Nevada',-->  
179 - <!--'New hampshire',-->  
180 - <!--'New jersey',-->  
181 - <!--'New mexico',-->  
182 - <!--'New york',-->  
183 - <!--'North carolina',-->  
184 - <!--'North dakota',-->  
185 - <!--'Ohio',-->  
186 - <!--'Oklahoma',-->  
187 - <!--'Oregon',-->  
188 - <!--'Pennsylvania',-->  
189 - <!--'Rhode island',-->  
190 - <!--'South carolina',-->  
191 - <!--'South dakota',-->  
192 - <!--'Tennessee',-->  
193 - <!--'Texas',-->  
194 - <!--'Utah',-->  
195 - <!--'Vermont',-->  
196 - <!--'Virginia',-->  
197 - <!--'Washington',-->  
198 - <!--'West virginia',-->  
199 - <!--'Wisconsin',-->  
200 - <!--'Wyoming',-->  
201 - <!--],-->  
202 - <!--};-->  
203 - <!--},-->  
204 - <!--methods: {-->  
205 - <!--remoteMethod1(query) {-->  
206 - <!--if (query !== '') {-->  
207 - <!--this.loading1 = true;-->  
208 - <!--setTimeout(() => {-->  
209 - <!--this.loading1 = false;-->  
210 - <!--const list = this.list.map((item) => ({-->  
211 - <!--value: item,-->  
212 - <!--label: item,-->  
213 - <!--}));-->  
214 - <!--this.options1 = list.filter((item) => item.label.toLowerCase().indexOf(query.toLowerCase()) > -1);-->  
215 - <!--}, 200);-->  
216 - <!--} else {-->  
217 - <!--this.options1 = [];-->  
218 - <!--}-->  
219 - <!--},-->  
220 - <!--remoteMethod2(query) {-->  
221 - <!--if (query !== '') {-->  
222 - <!--this.loading2 = true;-->  
223 - <!--setTimeout(() => {-->  
224 - <!--this.loading2 = false;-->  
225 - <!--const list = this.list.map((item) => ({-->  
226 - <!--value: item,-->  
227 - <!--label: item,-->  
228 - <!--}));-->  
229 - <!--this.options2 = list.filter((item) => item.label.toLowerCase().indexOf(query.toLowerCase()) > -1);-->  
230 - <!--}, 200);-->  
231 - <!--} else {-->  
232 - <!--this.options2 = [];-->  
233 - <!--}-->  
234 - <!--},-->  
235 - <!--},-->  
236 -<!--};-->  
237 -<!--</script>-->  
238 -  
239 -<!--<template>-->  
240 - <!--<div style="width: 300px">-->  
241 - <!--<Select-->  
242 - <!--v-model="model14"-->  
243 - <!--:remote-method="remoteMethod2"-->  
244 - <!--:loading="loading2"-->  
245 - <!--multiple-->  
246 - <!--filterable-->  
247 - <!--remote>-->  
248 - <!--<Option -->  
249 - <!--v-for="(option, index) in options2" -->  
250 - <!--:value="option.value" -->  
251 - <!--:key="index">{{option.label}}</Option>-->  
252 - <!--</Select>-->  
253 - <!--</div>-->  
254 -<!--</template>-->  
255 -<!--<script>-->  
256 -<!--export default {-->  
257 - <!--data() {-->  
258 - <!--return {-->  
259 - <!--model13: '',-->  
260 - <!--loading1: false,-->  
261 - <!--options1: [],-->  
262 - <!--model14: [],-->  
263 - <!--loading2: false,-->  
264 - <!--options2: [],-->  
265 - <!--list: ['a', 'b', 'c'],-->  
266 - <!--};-->  
267 - <!--},-->  
268 - <!--methods: {-->  
269 - <!--remoteMethod2(query) {-->  
270 - <!--if (query !== '') {-->  
271 - <!--this.loading2 = true;-->  
272 - <!--setTimeout(() => {-->  
273 - <!--this.loading2 = false;-->  
274 - <!--const list = this.list.map((item) => ({-->  
275 - <!--value: item,-->  
276 - <!--label: item,-->  
277 - <!--}));-->  
278 - <!--this.options2 = list.filter((item) => item.label.toLowerCase().indexOf(query.toLowerCase()) > -1);-->  
279 - <!--}, 200);-->  
280 - <!--} else {-->  
281 - <!--this.options2 = [];-->  
282 - <!--}-->  
283 - <!--},-->  
284 - <!--},-->  
285 -<!--};-->  
286 -<!--</script>-->  
287 -  
288 -  
289 -<!--<template>-->  
290 - <!--<Row>-->  
291 - <!--<Col -->  
292 - <!--span="12" -->  
293 - <!--style="padding-right:10px">-->  
294 - <!--<Select-->  
295 - <!--v-model="model13"-->  
296 - <!--:remote-method="remoteMethod1"-->  
297 - <!--:loading="loading1"-->  
298 - <!--filterable-->  
299 - <!--remote>-->  
300 - <!--<Option -->  
301 - <!--v-for="(option, index) in options1" -->  
302 - <!--:value="option.value" -->  
303 - <!--:key="index">{{option.label}}</Option>-->  
304 - <!--</Select>-->  
305 -<!--</Col>-->  
306 - <!--<Col span="12">-->  
307 - <!--<Select-->  
308 - <!--v-model="model14"-->  
309 - <!--:remote-method="remoteMethod2"-->  
310 - <!--:loading="loading2"-->  
311 - <!--multiple-->  
312 - <!--filterable-->  
313 - <!--remote>-->  
314 - <!--<Option -->  
315 - <!--v-for="(option, index) in options2" -->  
316 - <!--:value="option.value" -->  
317 - <!--:key="index">{{option.label}}</Option>-->  
318 - <!--</Select>-->  
319 -<!--</Col>-->  
320 - <!--</Row>-->  
321 -<!--</template>-->  
322 -<!--<script>-->  
323 -<!--export default {-->  
324 - <!--data() {-->  
325 - <!--return {-->  
326 - <!--model13: '',-->  
327 - <!--loading1: false,-->  
328 - <!--options1: [],-->  
329 - <!--model14: [],-->  
330 - <!--loading2: false,-->  
331 - <!--options2: [],-->  
332 - <!--list: [-->  
333 - <!--'Alabama',-->  
334 - <!--'Alaska',-->  
335 - <!--'Arizona',-->  
336 - <!--'Arkansas',-->  
337 - <!--'California',-->  
338 - <!--'Colorado',-->  
339 - <!--'Connecticut',-->  
340 - <!--'Delaware',-->  
341 - <!--'Florida',-->  
342 - <!--'Georgia',-->  
343 - <!--'Hawaii',-->  
344 - <!--'Idaho',-->  
345 - <!--'Illinois',-->  
346 - <!--'Indiana',-->  
347 - <!--'Iowa',-->  
348 - <!--'Kansas',-->  
349 - <!--'Kentucky',-->  
350 - <!--'Louisiana',-->  
351 - <!--'Maine',-->  
352 - <!--'Maryland',-->  
353 - <!--'Massachusetts',-->  
354 - <!--'Michigan',-->  
355 - <!--'Minnesota',-->  
356 - <!--'Mississippi',-->  
357 - <!--'Missouri',-->  
358 - <!--'Montana',-->  
359 - <!--'Nebraska',-->  
360 - <!--'Nevada',-->  
361 - <!--'New hampshire',-->  
362 - <!--'New jersey',-->  
363 - <!--'New mexico',-->  
364 - <!--'New york',-->  
365 - <!--'North carolina',-->  
366 - <!--'North dakota',-->  
367 - <!--'Ohio',-->  
368 - <!--'Oklahoma',-->  
369 - <!--'Oregon',-->  
370 - <!--'Pennsylvania',-->  
371 - <!--'Rhode island',-->  
372 - <!--'South carolina',-->  
373 - <!--'South dakota',-->  
374 - <!--'Tennessee',-->  
375 - <!--'Texas',-->  
376 - <!--'Utah',-->  
377 - <!--'Vermont',-->  
378 - <!--'Virginia',-->  
379 - <!--'Washington',-->  
380 - <!--'West virginia',-->  
381 - <!--'Wisconsin',-->  
382 - <!--'Wyoming',-->  
383 - <!--],-->  
384 - <!--};-->  
385 - <!--},-->  
386 - <!--methods: {-->  
387 - <!--remoteMethod1(query) {-->  
388 - <!--if (query !== '') {-->  
389 - <!--this.loading1 = true;-->  
390 - <!--setTimeout(() => {-->  
391 - <!--this.loading1 = false;-->  
392 - <!--const list = this.list.map((item) => ({-->  
393 - <!--value: item,-->  
394 - <!--label: item,-->  
395 - <!--}));-->  
396 - <!--this.options1 = list.filter((item) => item.label.toLowerCase().indexOf(query.toLowerCase()) > -1);-->  
397 - <!--}, 200);-->  
398 - <!--} else {-->  
399 - <!--this.options1 = [];-->  
400 - <!--}-->  
401 - <!--},-->  
402 - <!--remoteMethod2(query) {-->  
403 - <!--if (query !== '') {-->  
404 - <!--this.loading2 = true;-->  
405 - <!--setTimeout(() => {-->  
406 - <!--this.loading2 = false;-->  
407 - <!--const list = this.list.map((item) => ({-->  
408 - <!--value: item,-->  
409 - <!--label: item,-->  
410 - <!--}));-->  
411 - <!--this.options2 = list.filter((item) => item.label.toLowerCase().indexOf(query.toLowerCase()) > -1);-->  
412 - <!--}, 200);-->  
413 - <!--} else {-->  
414 - <!--this.options2 = [];-->  
415 - <!--}-->  
416 - <!--},-->  
417 - <!--},-->  
418 -<!--};-->  
419 -<!--</script>-->  
420 -  
421 -<!--<template>-->  
422 - <!--<div id="app">-->  
423 - <!--<input><br>-->  
424 - <!--<i-select-->  
425 - <!--v-model="model1"-->  
426 - <!--style="width:200px"-->  
427 - <!--&gt;-->  
428 - <!--<i-option-->  
429 - <!--v-for="item in cityList"-->  
430 - <!--:value="item.value"-->  
431 - <!--:key="item.value"-->  
432 - <!--&gt;{{item.label}}</i-option>-->  
433 - <!--</i-select>-->  
434 - <!--<br>-->  
435 - <!--<i-select-->  
436 - <!--v-model="model2"-->  
437 - <!--size="small"-->  
438 - <!--style="width:100px"-->  
439 - <!--&gt;-->  
440 - <!--<i-option-->  
441 - <!--v-for="item in cityList"-->  
442 - <!--:value="item.value"-->  
443 - <!--:key="item.value"-->  
444 - <!--&gt;{{item.label}}</i-option>-->  
445 - <!--</i-select>-->  
446 - <!--<i-select-->  
447 - <!--v-model="model3"-->  
448 - <!--style="width:100px"-->  
449 - <!--&gt;-->  
450 - <!--<i-option-->  
451 - <!--v-for="item in cityList"-->  
452 - <!--:value="item.value"-->  
453 - <!--:key="item.value"-->  
454 - <!--&gt;{{item.label}}</i-option>-->  
455 - <!--</i-select>-->  
456 - <!--<i-select-->  
457 - <!--v-model="model4"-->  
458 - <!--size="large"-->  
459 - <!--style="width:100px"-->  
460 - <!--&gt;-->  
461 - <!--<i-option-->  
462 - <!--v-for="item in cityList"-->  
463 - <!--:value="item.value"-->  
464 - <!--:key="item.value"-->  
465 - <!--&gt;{{item.label}}</i-option>-->  
466 - <!--</i-select>-->  
467 - <!--<br>-->  
468 - <!--<i-select-->  
469 - <!--v-model="model5"-->  
470 - <!--disabled-->  
471 - <!--style="width:200px"-->  
472 - <!--&gt;-->  
473 - <!--<i-option-->  
474 - <!--v-for="item in cityList"-->  
475 - <!--:value="item.value"-->  
476 - <!--:key="item.value"-->  
477 - <!--&gt;{{item.label}}</i-option>-->  
478 - <!--</i-select>-->  
479 - <!--<i-select-->  
480 - <!--v-model="model6"-->  
481 - <!--style="width:200px"-->  
482 - <!--&gt;-->  
483 - <!--<i-option value="beijing">New York</i-option>-->  
484 - <!--<i-option -->  
485 - <!--value="shanghai" -->  
486 - <!--disabled>London</i-option>-->  
487 - <!--<i-option value="shenzhen">Sydney</i-option>-->  
488 - <!--</i-select>-->  
489 - <!--<br>-->  
490 - <!--<i-select-->  
491 - <!--v-model="model8"-->  
492 - <!--clearable-->  
493 - <!--style="width:200px"-->  
494 - <!--&gt;-->  
495 - <!--<i-option-->  
496 - <!--v-for="item in cityList"-->  
497 - <!--:value="item.value"-->  
498 - <!--:key="item.value"-->  
499 - <!--&gt;{{item.label}}</i-option>-->  
500 - <!--</i-select>-->  
501 - <!--<br>-->  
502 - <!--<i-select-->  
503 - <!--v-model="model7"-->  
504 - <!--style="width:200px"-->  
505 - <!--&gt;-->  
506 - <!--<option-group label="Hot Cities">-->  
507 - <!--<i-option-->  
508 - <!--v-for="item in cityList1"-->  
509 - <!--:value="item.value"-->  
510 - <!--:key="item.value"-->  
511 - <!--&gt;{{item.label}}</i-option>-->  
512 - <!--</option-group>-->  
513 - <!--<option-group label="Other Cities">-->  
514 - <!--<i-option-->  
515 - <!--v-for="item in cityList2"-->  
516 - <!--:value="item.value"-->  
517 - <!--:key="item.value"-->  
518 - <!--&gt;{{item.label}}</i-option>-->  
519 - <!--</option-group>-->  
520 - <!--</i-select>-->  
521 - <!--<br>-->  
522 - <!--<i-select-->  
523 - <!--v-model="model9"-->  
524 - <!--style="width:200px"-->  
525 - <!--&gt;-->  
526 - <!--<i-option -->  
527 - <!--value="New York" -->  
528 - <!--label="New York">-->  
529 - <!--<span>New York</span>-->  
530 - <!--<span style="float:right;color:#ccc">America</span>-->  
531 - <!--</i-option>-->  
532 - <!--<i-option -->  
533 - <!--value="London" -->  
534 - <!--label="London">-->  
535 - <!--<span>London</span>-->  
536 - <!--<span style="float:right;color:#ccc">U.K.</span>-->  
537 - <!--</i-option>-->  
538 - <!--<i-option -->  
539 - <!--value="Sydney" -->  
540 - <!--label="Sydney">-->  
541 - <!--<span>Sydney</span>-->  
542 - <!--<span style="float:right;color:#ccc">Australian</span>-->  
543 - <!--</i-option>-->  
544 - <!--</i-select>-->  
545 - <!--<br>-->  
546 - <!--<div>here</div>-->  
547 - <!--<i-select-->  
548 - <!--v-model="model10"-->  
549 - <!--multiple-->  
550 - <!--style="width:260px"-->  
551 - <!--&gt;-->  
552 - <!--<i-option-->  
553 - <!--v-for="item in cityList"-->  
554 - <!--:value="item.value"-->  
555 - <!--:key="item.value"-->  
556 - <!--&gt;{{item.label}}</i-option>-->  
557 - <!--</i-select>-->  
558 - <!--<br>-->  
559 - <!--<row>-->  
560 - <!--<i-col-->  
561 - <!--span="12"-->  
562 - <!--style="padding-right:10px"-->  
563 - <!--&gt;-->  
564 - <!--<i-select-->  
565 - <!--v-model="model11"-->  
566 - <!--filterable-->  
567 - <!--&gt;-->  
568 - <!--<i-option-->  
569 - <!--v-for="item in cityList"-->  
570 - <!--:value="item.value"-->  
571 - <!--:key="item.value"-->  
572 - <!--&gt;{{item.label}}</i-option>-->  
573 - <!--</i-select>-->  
574 - <!--</i-col>-->  
575 - <!--<i-col span="12">-->  
576 - <!--<i-select-->  
577 - <!--v-model="model12"-->  
578 - <!--filterable-->  
579 - <!--multiple-->  
580 - <!--&gt;-->  
581 - <!--<i-option-->  
582 - <!--v-for="item in cityList"-->  
583 - <!--:value="item.value"-->  
584 - <!--:key="item.value"-->  
585 - <!--&gt;{{item.label}}</i-option>-->  
586 - <!--</i-select>-->  
587 - <!--</i-col>-->  
588 - <!--</row>-->  
589 - <!--<br>-->  
590 - <!--<row>-->  
591 - <!--<i-col-->  
592 - <!--span="12"-->  
593 - <!--style="padding-right:10px"-->  
594 - <!--&gt;-->  
595 - <!--<i-select-->  
596 - <!--v-model="model13"-->  
597 - <!--:remote-method="remoteMethod1"-->  
598 - <!--:loading="loading1"-->  
599 - <!--filterable-->  
600 - <!--remote-->  
601 - <!--clearable-->  
602 - <!--&gt;-->  
603 - <!--<i-option-->  
604 - <!--v-for="(option, index) in options1"-->  
605 - <!--:value="option.value"-->  
606 - <!--:key="index"-->  
607 - <!--&gt;{{option.label}}</i-option>-->  
608 - <!--</i-select>-->  
609 - <!--</i-col>-->  
610 - <!--<i-col span="12">-->  
611 - <!--<i-select-->  
612 - <!--v-model="model14"-->  
613 - <!--:remote-method="remoteMethod2"-->  
614 - <!--:loading="loading2"-->  
615 - <!--multiple-->  
616 - <!--filterable-->  
617 - <!--remote-->  
618 - <!--clearable>-->  
619 - <!--<i-option-->  
620 - <!--v-for="(option, index) in options2"-->  
621 - <!--:value="option.value"-->  
622 - <!--:key="index"-->  
623 - <!--&gt;{{option.label}}</i-option>-->  
624 - <!--</i-select>-->  
625 - <!--</i-col>-->  
626 - <!--</row>-->  
627 - <!--</div>-->  
628 -<!--</template>-->  
629 -  
630 -<!--<script>-->  
631 -<!--export default {-->  
632 - <!--data() {-->  
633 - <!--return {-->  
634 - <!--cityList: [-->  
635 - <!--{-->  
636 - <!--value: 'New York',-->  
637 - <!--label: 'New York',-->  
638 - <!--},-->  
639 - <!--{-->  
640 - <!--value: 'London',-->  
641 - <!--label: 'London',-->  
642 - <!--},-->  
643 - <!--{-->  
644 - <!--value: 'Sydney',-->  
645 - <!--label: 'Sydney',-->  
646 - <!--},-->  
647 - <!--{-->  
648 - <!--value: 'Ottawa',-->  
649 - <!--label: 'Ottawa',-->  
650 - <!--},-->  
651 - <!--{-->  
652 - <!--value: 'Paris',-->  
653 - <!--label: 'Paris',-->  
654 - <!--},-->  
655 - <!--{-->  
656 - <!--value: 'Canberra',-->  
657 - <!--label: 'Canberra',-->  
658 - <!--},-->  
659 - <!--],-->  
660 - <!--cityList1: [-->  
661 - <!--{-->  
662 - <!--value: 'New York',-->  
663 - <!--label: 'New York',-->  
664 - <!--},-->  
665 - <!--{-->  
666 - <!--value: 'London',-->  
667 - <!--label: 'London',-->  
668 - <!--},-->  
669 - <!--{-->  
670 - <!--value: 'Sydney',-->  
671 - <!--label: 'Sydney',-->  
672 - <!--},-->  
673 - <!--],-->  
674 - <!--cityList2: [-->  
675 - <!--{-->  
676 - <!--value: 'Ottawa',-->  
677 - <!--label: 'Ottawa',-->  
678 - <!--},-->  
679 - <!--{-->  
680 - <!--value: 'Paris',-->  
681 - <!--label: 'Paris',-->  
682 - <!--},-->  
683 - <!--{-->  
684 - <!--value: 'Canberra',-->  
685 - <!--label: 'Canberra',-->  
686 - <!--},-->  
687 - <!--],-->  
688 - <!--model1: '',-->  
689 - <!--model2: '',-->  
690 - <!--model3: '',-->  
691 - <!--model4: '',-->  
692 - <!--model5: '',-->  
693 - <!--model6: '',-->  
694 - <!--model7: '',-->  
695 - <!--model8: '',-->  
696 - <!--model9: '',-->  
697 - <!--model10: [],-->  
698 - <!--model11: '',-->  
699 - <!--model12: [],-->  
700 - <!--model13: '',-->  
701 - <!--loading1: false,-->  
702 - <!--options1: [],-->  
703 - <!--model14: [],-->  
704 - <!--loading2: false,-->  
705 - <!--options2: [],-->  
706 - <!--list: [-->  
707 - <!--'Alabama',-->  
708 - <!--'Alaska',-->  
709 - <!--'Arizona',-->  
710 - <!--'Arkansas',-->  
711 - <!--'California',-->  
712 - <!--'Colorado',-->  
713 - <!--'Connecticut',-->  
714 - <!--'Delaware',-->  
715 - <!--'Florida',-->  
716 - <!--'Georgia',-->  
717 - <!--'Hawaii',-->  
718 - <!--'Idaho',-->  
719 - <!--'Illinois',-->  
720 - <!--'Indiana',-->  
721 - <!--'Iowa',-->  
722 - <!--'Kansas',-->  
723 - <!--'Kentucky',-->  
724 - <!--'Louisiana',-->  
725 - <!--'Maine',-->  
726 - <!--'Maryland',-->  
727 - <!--'Massachusetts',-->  
728 - <!--'Michigan',-->  
729 - <!--'Minnesota',-->  
730 - <!--'Mississippi',-->  
731 - <!--'Missouri',-->  
732 - <!--'Montana',-->  
733 - <!--'Nebraska',-->  
734 - <!--'Nevada',-->  
735 - <!--'New hampshire',-->  
736 - <!--'New jersey',-->  
737 - <!--'New mexico',-->  
738 - <!--'New york',-->  
739 - <!--'North carolina',-->  
740 - <!--'North dakota',-->  
741 - <!--'Ohio',-->  
742 - <!--'Oklahoma',-->  
743 - <!--'Oregon',-->  
744 - <!--'Pennsylvania',-->  
745 - <!--'Rhode island',-->  
746 - <!--'South carolina',-->  
747 - <!--'South dakota',-->  
748 - <!--'Tennessee',-->  
749 - <!--'Texas',-->  
750 - <!--'Utah',-->  
751 - <!--'Vermont',-->  
752 - <!--'Virginia',-->  
753 - <!--'Washington',-->  
754 - <!--'West virginia',-->  
755 - <!--'Wisconsin',-->  
756 - <!--'Wyoming',-->  
757 - <!--],-->  
758 - <!--};-->  
759 - <!--},-->  
760 -  
761 - <!--methods: {-->  
762 - <!--remoteMethod1(query) {-->  
763 - <!--if (query !== '') {-->  
764 - <!--this.loading1 = true;-->  
765 -  
766 - <!--setTimeout(() => {-->  
767 - <!--this.loading1 = false;-->  
768 -  
769 - <!--const list = this.list.map((item) => ({-->  
770 - <!--value: item,-->  
771 - <!--label: item,-->  
772 - <!--}));-->  
773 -  
774 - <!--this.options1 = list.filter((item) => item.label.toLowerCase().includes(query.toLowerCase()));-->  
775 - <!--}, 1500);-->  
776 - <!--} else {-->  
777 - <!--this.options1 = [];-->  
778 - <!--}-->  
779 - <!--},-->  
780 - <!--remoteMethod2(query) {-->  
781 - <!--if (query !== '') {-->  
782 - <!--this.loading2 = true;-->  
783 -  
784 - <!--setTimeout(() => {-->  
785 - <!--this.loading2 = false;-->  
786 -  
787 - <!--const list = this.list.map((item) => ({-->  
788 - <!--value: item,-->  
789 - <!--label: item,-->  
790 - <!--}));-->  
791 -  
792 - <!--this.options2 = list.filter((item) => item.label.toLowerCase().includes(query.toLowerCase()));-->  
793 - <!--}, 200);-->  
794 - <!--} else {-->  
795 - <!--this.options2 = [];-->  
796 - <!--}-->  
797 - <!--},-->  
798 - <!--},-->  
799 -<!--};-->  
800 -<!--</script>-->  
801 -  
802 -  
803 <template> 1 <template>
804 - <div>  
805 - <Select  
806 - v-model="model1"  
807 - size="small"  
808 - style="width:200px;" >  
809 - <Option  
810 - v-for="item in cityList"  
811 - :value="item.value"  
812 - :key="item.value">{{item.label}}</Option>  
813 - </Select>  
814 - <Select  
815 - v-model="model10"  
816 - size="small"  
817 - multiple  
818 - style="width:260px" >  
819 - <Option  
820 - v-for="item in cityList"  
821 - :value="item.value"  
822 - :key="item.value">{{item.label}}</Option>  
823 - </Select>  
824 -  
825 - <br><br>  
826 -  
827 - <Select  
828 - v-model="model1"  
829 - size="large"  
830 - style="width:200px"  
831 - clearable  
832 - @on-clear="onClear">  
833 - <Option  
834 - v-for="item in cityList"  
835 - :value="item.value"  
836 - :key="item.value">{{item.label}}</Option>  
837 - </Select>  
838 - <Select  
839 - v-model="model10"  
840 - size="large"  
841 - multiple  
842 - style="width:260px">  
843 - <Option  
844 - v-for="item in cityList"  
845 - :value="item.value"  
846 - :key="item.value">{{item.label}}</Option>  
847 - </Select>  
848 -  
849 - <br><br>  
850 -  
851 - <Select  
852 - v-model="model1"  
853 - style="width:200px">  
854 - <Option  
855 - v-for="item in cityList"  
856 - :value="item.value"  
857 - :key="item.value">{{item.label}}</Option>  
858 - </Select>  
859 - <Select  
860 - v-model="model11"  
861 - multiple  
862 - style="width:260px">  
863 - <Option  
864 - v-for="item in cityList"  
865 - :value="item.value"  
866 - :key="item.value">{{item.label}}</Option>  
867 - </Select>  
868 - <Select  
869 - v-model="model10"  
870 - multiple  
871 - style="width:260px">  
872 - <Option  
873 - v-for="item in cityList"  
874 - :value="item.value"  
875 - :key="item.value">{{item.label}}</Option>  
876 - </Select>  
877 -  
878 - <br><br>  
879 -  
880 - <br><br>  
881 -  
882 - <br><br>  
883 - <br><br>  
884 - <br><br>  
885 - <br><br>  
886 - <br><br>  
887 - <br><br>  
888 - <Select  
889 - v-model="model10"  
890 - multiple  
891 - style="width:260px">  
892 - <Option  
893 - v-for="item in cityList"  
894 - :value="item.value"  
895 - :key="item.value">{{item.label}}</Option>  
896 - </Select>  
897 - <br><br>  
898 -  
899 - <br><br>  
900 -  
901 - <br><br>  
902 - <br><br>  
903 - <br><br>  
904 - <br><br>  
905 - <br><br>  
906 - <br><br>  
907 - <Select  
908 - v-model="model10"  
909 - multiple  
910 - style="width:260px">  
911 - <Option  
912 - v-for="item in cityList"  
913 - :value="item.value"  
914 - :key="item.value">{{item.label}}</Option>  
915 - </Select>  
916 - </div> 2 + <Select v-model="model1" style="width:200px">
  3 + <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
  4 + </Select>
917 </template> 5 </template>
918 <script> 6 <script>
919 -export default {  
920 - data() {  
921 - return {  
922 - cityList: [  
923 - {  
924 - value: 'New York',  
925 - label: 'New York',  
926 - },  
927 - {  
928 - value: '中国',  
929 - label: '中国',  
930 - },  
931 - {  
932 - value: 'Sydney',  
933 - label: 'Sydney',  
934 - },  
935 - {  
936 - value: 'Ottawa',  
937 - label: 'Ottawa',  
938 - },  
939 - {  
940 - value: 'Paris',  
941 - label: 'Paris',  
942 - },  
943 - {  
944 - value: 'Canberra',  
945 - label: 'Canberra',  
946 - },  
947 - ],  
948 - model1: '',  
949 - model10: [],  
950 - model11: [],  
951 - };  
952 - },  
953 - methods: {  
954 - onClear() {  
955 - console.log('onClear');  
956 - },  
957 - },  
958 -}; 7 + export default {
  8 + data () {
  9 + return {
  10 + cityList: [
  11 + {
  12 + value: 'New York',
  13 + label: 'New York'
  14 + },
  15 + {
  16 + value: 'London',
  17 + label: 'London'
  18 + },
  19 + {
  20 + value: 'Sydney',
  21 + label: 'Sydney'
  22 + },
  23 + {
  24 + value: 'Ottawa',
  25 + label: 'Ottawa'
  26 + },
  27 + {
  28 + value: 'Paris',
  29 + label: 'Paris'
  30 + },
  31 + {
  32 + value: 'Canberra',
  33 + label: 'Canberra'
  34 + }
  35 + ],
  36 + model1: ''
  37 + }
  38 + }
  39 + }
959 </script> 40 </script>
src/components/select/select.vue
@@ -204,7 +204,9 @@ @@ -204,7 +204,9 @@
204 }, 204 },
205 transfer: { 205 transfer: {
206 type: Boolean, 206 type: Boolean,
207 - default: false 207 + default () {
  208 + return this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
  209 + }
208 }, 210 },
209 // Use for AutoComplete 211 // Use for AutoComplete
210 autoComplete: { 212 autoComplete: {
@@ -164,6 +164,11 @@ const install = function(Vue, opts = {}) { @@ -164,6 +164,11 @@ const install = function(Vue, opts = {}) {
164 Vue.component(key, iview[key]); 164 Vue.component(key, iview[key]);
165 }); 165 });
166 166
  167 + Vue.prototype.$IVIEW = {
  168 + size: opts.size || '',
  169 + transfer: opts.transfer || ''
  170 + };
  171 +
167 Vue.prototype.$Loading = LoadingBar; 172 Vue.prototype.$Loading = LoadingBar;
168 Vue.prototype.$Message = Message; 173 Vue.prototype.$Message = Message;
169 Vue.prototype.$Modal = Modal; 174 Vue.prototype.$Modal = Modal;