diff --git a/src/components/select/select.vue b/src/components/select/select.vue index a6f54c6..3798a39 100644 --- a/src/components/select/select.vue +++ b/src/components/select/select.vue @@ -1,5 +1,9 @@ <template> - <div :class="classes" v-clickoutside="handleClose"> + <div + tabindex="0" + @keydown.down="handleFocus" + :class="classes" + v-clickoutside="handleClose"> <div :class="selectionCls" ref="reference" @@ -260,6 +264,10 @@ } }, methods: { + // open when focus on Select and press `down` key + handleFocus () { + if (!this.visible) this.toggleMenu(); + }, toggleMenu () { if (this.disabled || this.autoComplete) { return false; diff --git a/src/styles/components/select.less b/src/styles/components/select.less index 4e2f4d2..fe860ca 100644 --- a/src/styles/components/select.less +++ b/src/styles/components/select.less @@ -55,6 +55,12 @@ transform: rotate(180deg); } } + &:focus{ + outline: 0; + .@{select-prefix-cls}-selection{ + .active(); + } + } &-disabled { .@{select-prefix-cls}-selection { -- libgit2 0.21.4