Select support a part of keyboard accessibility, #1647
This commit is contained in:
parent
2c6b8f09b7
commit
2fbe636b52
2 changed files with 15 additions and 1 deletions
|
@ -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;
|
||||
|
|
|
@ -55,6 +55,12 @@
|
|||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
&:focus{
|
||||
outline: 0;
|
||||
.@{select-prefix-cls}-selection{
|
||||
.active();
|
||||
}
|
||||
}
|
||||
|
||||
&-disabled {
|
||||
.@{select-prefix-cls}-selection {
|
||||
|
|
Loading…
Add table
Reference in a new issue