auto scroll to de last q-tab

[ezioadsr]

I want to auto scroll to de last tab on my application.
I’m using v-model to set a q-tab selected.
Any idea?
<q-tabs :class="preference" v-model="tab"> <q-tab v-for=" __tab in tabs" :ref="__tab.name" :name="__tab.name" :icon="__tab.icon" :route="__tab.route">{{__tab.name}} </q-tab> </q-tabs>

…

data () => ({tab: 'tab20' tabs: [{name: 'tab1' ,..... name: 'tab20' ...}]});

[benoitranque]

Hello. You can set a function in a vue-router redirect. so something like

var routes = [
{
  path: 'parentRoute',
  component: myComponent,
  children: [
    {
      path: 'tab1'
      component: tabComponent1
    },
    {
      path: 'tab2'
      component: tabComponent2
    },
...
    {
      path: 'tab20'
      component: tabComponent20
    },
    {
      path: ''
      redirect: () => {
        // set the route you want
        return 'tab20'
      }
    },
  ]
}
...
]

[ezioadsr]

In this case, i’m not using a router. When i select a tab using v-model, with many tabs, the display don’t scroll to it. But I keep trying here

[benoitranque]

Are you saying you use the tabs to scroll on the same page? This is not exactly what tabs are for… Also, 20 tabs on the same page? I would suggest using different pages and vuex if you need a shared state. But I am sure you can get it to work. You need:

• To set q-tab selected manually
• To watch for page scrolling and set/unset q-tab selected
• To scroll to the appropriate parte of the page when a q-tab is clicked using @click

Good luck

[rstoenescu]

What version are you on? This issue can’t happen in v0.14.

[ezioadsr]

I’m sorry. Probably my problem occour because another problem. This is working now.