Correct logic for selecting by keyboard
This commit is contained in:
parent
2bf3e04753
commit
38ab744203
2 changed files with 40 additions and 16 deletions
|
@ -237,21 +237,9 @@
|
|||
this.focusedKey = nextTab.name;
|
||||
},
|
||||
handleTabKeyboardSelect(){
|
||||
this.activeKey = this.focusedKey || 0;
|
||||
const nextIndex = Math.max(this.navList.findIndex(tab => tab.name === this.focusedKey), 0);
|
||||
|
||||
[...this.$refs.panes.children].forEach((el, i) => {
|
||||
if (nextIndex === i) {
|
||||
[...el.children].forEach(child => child.style.display = 'block');
|
||||
setTimeout(() => {
|
||||
focusFirst(el, el);
|
||||
}, transitionTime);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
[...el.children].forEach(child => child.style.display = 'none');
|
||||
}, transitionTime);
|
||||
}
|
||||
});
|
||||
const focused = this.focusedKey || 0;
|
||||
const index = this.navList.findIndex(({name}) => name === focused);
|
||||
this.handleChange(index);
|
||||
},
|
||||
handleRemove (index) {
|
||||
const tabs = this.getTabs();
|
||||
|
@ -394,6 +382,21 @@
|
|||
this.$nextTick(() => {
|
||||
this.scrollToActiveTab();
|
||||
});
|
||||
|
||||
// update visibility
|
||||
const nextIndex = Math.max(this.navList.findIndex(tab => tab.name === this.focusedKey), 0);
|
||||
[...this.$refs.panes.children].forEach((el, i) => {
|
||||
if (nextIndex === i) {
|
||||
[...el.children].forEach(child => child.style.display = 'block');
|
||||
setTimeout(() => {
|
||||
focusFirst(el, el);
|
||||
}, transitionTime);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
[...el.children].forEach(child => child.style.display = 'none');
|
||||
}, transitionTime);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue