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'); | ... | ... |