update Tabs keyboard logic and support @on-click event

This commit is contained in:
梁灏 2018-05-14 15:38:07 +08:00
parent ce7b39c204
commit d45e919663
2 changed files with 14 additions and 210 deletions

View file

@ -47,19 +47,6 @@
else return nextTab;
};
const focusFirst = (element, root) => {
try {element.focus();}
catch(err) {} // eslint-disable-line no-empty
if (document.activeElement == element && element !== root) return true;
const candidates = element.children;
for (let candidate of candidates) {
if (focusFirst(candidate, root)) return true;
}
return false;
};
export default {
name: 'Tabs',
mixins: [ Emitter ],
@ -240,18 +227,7 @@
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);
}
});
this.handleChange(nextIndex);
},
handleRemove (index) {
const tabs = this.getTabs();
@ -412,8 +388,6 @@
this.mutationObserver.observe(hiddenParentNode, { attributes: true, childList: true, characterData: true, attributeFilter: ['style'] });
}
this.handleTabKeyboardSelect();
},
beforeDestroy() {
this.observer.removeListener(this.$refs.navWrap, this.handleResize);