Skip to content
Permalink
Browse files

fix(MdTabs): correct indicator position while alignment changed (#1442)

`setIndicatorStyles` on `transitionend` for correct position while alignment changed

fix #1432
  • Loading branch information...
VdustR authored and marcosmoura committed Jan 26, 2018
1 parent 4722dad commit c5fc2f5e190ab4f72362a3efc482ba6565756cc8
Showing with 20 additions and 3 deletions.
  1. +20 −3 src/components/MdTabs/MdTabs.vue
@@ -1,6 +1,6 @@
<template>
<div class="md-tabs" :class="[tabsClasses, $mdActiveTheme]">
<div class="md-tabs-navigation" :class="navigationClasses">
<div class="md-tabs-navigation" :class="navigationClasses" ref="navigation">
<md-button
v-for="({ label, props, icon, disabled, data, events }, index) in MdTabs.items"
:key="index"
@@ -75,7 +75,8 @@
hasContent: false,
MdTabs: {
items: {}
}
},
alignmentChanging: false
}),
provide () {
return {
@@ -112,8 +113,24 @@
this.$emit('md-changed', tab)
},
async mdAlignment () {
if (this.alignmentChanging) {
return false
}
this.alignmentChanging = true
await this.$nextTick()
this.setIndicatorStyles()
let cb = event => {
if (event.propertyName !== 'min-width') {
return false
}
this.$refs.navigation.removeEventListener('transitionend', cb)
this.setIndicatorStyles()
this.alignmentChanging = false
}
this.$refs.navigation.addEventListener('transitionend', cb)
}
},
methods: {

0 comments on commit c5fc2f5

Please sign in to comment.
You can’t perform that action at this time.