Vuetify: [Bug Report] Tabs is not working properly with modal
Versions and Environment
Vuetify: 1.0.3
Vue: 2.5.11
Browsers: Chrome 64.0.3282.186
OS: Windows 10
Steps to reproduce
Load the pen, open modal, then try to click on tabs.
Expected Behavior
On first load of modal the first element of tab should be selected.
Actual Behavior
On initial modal load there are no selected tab.
Reproduction Link
wontfix
wildstyles
All 4 comments
That is because tabs uses the dom in order to position the slider. While it is in the dialog, it has no dimensions to measure. The proper way to do this would be to add the lazy prop to the dialog.
johnleider
on 14 Mar 2018
🎉3
I see an issue has been filed for this no fewer than 3 times (and I'm here because I encountered it also).
Would be great if this gotcha (and solution) could be added somewhere on the tabs docs page.
jdunk
on 16 Apr 2018
@jdunk good idea imho, please create an issue in vuetifyjs.com repo
jacekkarczmarczyk
on 16 Apr 2018
![lock[bot] picture](https://avatars1.githubusercontent.com/in/6672?v=4&s=40)
lock[bot]
Was this page helpful?
0 / 5 - 0 ratings
Related issues
itanka9
路
3Comments
ricardovanlaarhoven
路
3Comments
milleraa
路
3Comments
efootstep
路
3Comments
SteffenDE
路
3Comments
Most helpful comment
That is because tabs uses the dom in order to position the slider. While it is in the dialog, it has no dimensions to measure. The proper way to do this would be to add the lazy prop to the dialog.
https://codepen.io/johnjleider/pen/dmMNrv?editors=1010