diff --git a/src/components/selectbutton/SelectButton.vue b/src/components/selectbutton/SelectButton.vue index 1a7c1735d..91514f2d1 100644 --- a/src/components/selectbutton/SelectButton.vue +++ b/src/components/selectbutton/SelectButton.vue @@ -2,8 +2,8 @@
+ :tabindex="isOptionDisabled(option) ? null : '0'" @focus="onFocus($event, i)" @blur="onBlur($event)" + :class="['p-button p-component p-button-text-only', {'p-highlight': isSelected(option), 'p-disabled': isOptionDisabled(option), 'p-focus': (i === focusedIndex)}]"> {{getOptionLabel(option)}} @@ -26,6 +26,11 @@ export default { optionValue: null, optionDisabled: null }, + data() { + return { + focusedIndex: null + }; + }, methods: { getOptionLabel(option) { return ObjectUtils.resolveFieldData(option, this.optionLabel); @@ -76,6 +81,14 @@ export default { } return selected; + }, + onFocus(event, index) { + this.focusedIndex = index; + this.$emit('focus', event); + }, + onBlur() { + this.focusedIndex = null + this.$emit('blur', event); } } }