Commit ddc35c9aaaa0357d8f7b30185c92019ca4cc7322
1 parent
3842df9a
fixed #952
Showing
2 changed files
with
30 additions
and
3 deletions
Show diff stats
examples/routers/select.vue
... | ... | @@ -2,7 +2,7 @@ |
2 | 2 | <Row> |
3 | 3 | <i-col span="4">{{model}}</i-col> |
4 | 4 | <i-col span="8"> |
5 | - <i-select v-model="model" @input="handleInput" filterable remote :remote-method="remoteMethod" :loading="loading" clearable> | |
5 | + <i-select v-model="model" :label="['L Alabama', 'L Hawaii']" multiple @input="handleInput" filterable remote :remote-method="remoteMethod" :loading="loading" clearable> | |
6 | 6 | <i-option v-for="option in options" :value="option.value" :key="new Date()">{{option.label}}</i-option> |
7 | 7 | </i-select> |
8 | 8 | </i-col> |
... | ... | @@ -13,7 +13,8 @@ |
13 | 13 | export default { |
14 | 14 | data () { |
15 | 15 | return { |
16 | - model: '', | |
16 | +// model: 'Alabama', | |
17 | + model: ['Alabama', 'Hawaii'], | |
17 | 18 | options: [ |
18 | 19 | |
19 | 20 | ], |
... | ... | @@ -74,6 +75,7 @@ |
74 | 75 | ] |
75 | 76 | }, |
76 | 77 | remoteMethod (query) { |
78 | + console.log(13) | |
77 | 79 | if (query !== '') { |
78 | 80 | this.loading = true; |
79 | 81 | setTimeout(() => { | ... | ... |
src/components/select/select.vue
... | ... | @@ -53,6 +53,10 @@ |
53 | 53 | type: [String, Number, Array], |
54 | 54 | default: '' |
55 | 55 | }, |
56 | + label: { | |
57 | + type: [String, Number, Array], | |
58 | + default: '' | |
59 | + }, | |
56 | 60 | multiple: { |
57 | 61 | type: Boolean, |
58 | 62 | default: false |
... | ... | @@ -303,7 +307,6 @@ |
303 | 307 | }, |
304 | 308 | updateMultipleSelected (init = false, slot = false) { |
305 | 309 | if (this.multiple && Array.isArray(this.model)) { |
306 | - // todo 这里的 label 有问题,另删除字符时也有问题 | |
307 | 310 | let selected = this.remote ? this.selectedMultiple : []; |
308 | 311 | |
309 | 312 | for (let i = 0; i < this.model.length; i++) { |
... | ... | @@ -584,6 +587,23 @@ |
584 | 587 | }, |
585 | 588 | mounted () { |
586 | 589 | this.modelToQuery(); |
590 | + // 处理 remote 初始值 | |
591 | + if (this.remote) { | |
592 | + if (!this.multiple && this.model !== '') { | |
593 | + this.selectToChangeQuery = true; | |
594 | + if (this.label === '') this.label = this.model; | |
595 | + this.lastQuery = this.label; | |
596 | + this.query = this.label; | |
597 | + } else if (this.multiple && this.model.length) { | |
598 | + if (this.label.length !== this.model.length) this.label = this.model; | |
599 | + this.selectedMultiple = this.model.map((item, index) => { | |
600 | + return { | |
601 | + value: item, | |
602 | + label: this.label[index] | |
603 | + }; | |
604 | + }); | |
605 | + } | |
606 | + } | |
587 | 607 | this.$nextTick(() => { |
588 | 608 | this.broadcastQuery(''); |
589 | 609 | }); |
... | ... | @@ -687,6 +707,11 @@ |
687 | 707 | this.findChild(child => { |
688 | 708 | child.selected = this.multiple ? this.model.indexOf(child.value) > -1 : this.model === child.value; |
689 | 709 | }); |
710 | + // remote下,设置了默认值,第一次打开时,搜索一次 | |
711 | + const options = this.$slots.default || []; | |
712 | + if (this.query !== '' && !options.length) { | |
713 | + this.remoteMethod(this.query); | |
714 | + } | |
690 | 715 | } |
691 | 716 | } |
692 | 717 | this.broadcast('Drop', 'on-update-popper'); | ... | ... |