diff --git a/packages/select/src/select.vue b/packages/select/src/select.vue index ca0ec2c18..83d47007c 100644 --- a/packages/select/src/select.vue +++ b/packages/select/src/select.vue @@ -28,6 +28,7 @@ class="el-select__input" :class="[selectSize ? `is-${ selectSize }` : '']" :disabled="disabled" + @focus="handleFocus" @keyup="managePlaceholder" @keydown="resetInputState" @keydown.down.prevent="navigateOptions('next')" @@ -82,7 +83,7 @@ tag="ul" wrap-class="el-select-dropdown__wrap" view-class="el-select-dropdown__list" - :class="{ 'is-empty': !allowCreate && filteredOptionsCount === 0 }" + :class="{ 'is-empty': !allowCreate && query && filteredOptionsCount === 0 }" v-show="options.length > 0 && !loading"> 0 && this.filteredOptionsCount === 0) { + if (this.filterable && this.query && this.options.length > 0 && this.filteredOptionsCount === 0) { return this.noMatchText || this.t('el.select.noMatch'); } if (this.options.length === 0) { @@ -538,7 +539,7 @@ let inputChildNodes = this.$refs.reference.$el.childNodes; let input = [].filter.call(inputChildNodes, item => item.tagName === 'INPUT')[0]; const tags = this.$refs.tags; - input.style.height = this.selected.length === 0 && this.selectSize === 'mini' + input.style.height = this.selected.length === 0 ? sizeMap[this.selectSize] + 'px' : Math.max(tags ? (tags.clientHeight + 10) : 0, sizeMap[this.selectSize] || 40) + 'px'; if (this.visible && this.emptyText !== false) { diff --git a/packages/theme-chalk/src/select.scss b/packages/theme-chalk/src/select.scss index 72c169dca..1865be21f 100644 --- a/packages/theme-chalk/src/select.scss +++ b/packages/theme-chalk/src/select.scss @@ -62,6 +62,10 @@ } } } + + &.is-focus .el-input__inner { + border-color: $--select-input-focus-background; + } } > .el-input { @@ -75,7 +79,7 @@ margin-left: 15px; color: $--select-multiple-input-color; font-size: $--select-font-size; - vertical-align: baseline; + vertical-align: middle; appearance: none; height: 28px; background-color: transparent; @@ -121,6 +125,7 @@ &__close.el-icon-close { background-color: $--color-text-placeholder; right: -7px; + top: 0; color: $--color-white; &:hover {