Hi,

I’m trying to create tabs dynamically (this is ok) but I’m getting a problem when I try scoll my page.

My problem are:
1 -> If in the q-tabs I put the slot=navigation, I can’t scroll my page;
2 -> If not put slot=navigation, I can scroll and everything works ok when I scroll down. Bt to see tabs again, I need to scroll to top of the page…

Anyone had the some problem?

The problem is when I use q-tab and q-tab-pane because with q-route-tab seems work everything ok.

I’m using quasar v0.14.7

I follow the quasar documentation and code this small example:

<template>
  <q-layout ref="layout" reveal>
   
    <q-toolbar slot="header">
      <q-toolbar-title> test </q-toolbar-title>
    </q-toolbar>

    <q-tabs slot="navigation">
      <q-tab  name="test" slot="title" label="test" />
      <q-tab-pane name="test">
        <div class="row" v-for="i in 10000">
            {{i}}
        </div>
      </q-tab-pane>
    </q-tabs>
    
  </q-layout>
</template>

Ok basically the problem is with q-tab-pane. Now I only use q-tab, and with select handler I change the visibility of divs…and the scroll seems to work ok.

Ok basically the problem is with q-tab-pane. Now I only use q-tab, and with select handler I change the visibility of divs…and the scroll seems to work ok.

Hi,

I’m trying to create tabs dynamically (this is ok) but I’m getting a problem when I try scoll my page.

My problem are:
1 -> If in the q-tabs I put the slot=navigation, I can’t scroll my page;
2 -> If not put slot=navigation, I can scroll and everything works ok when I scroll down. Bt to see tabs again, I need to scroll to top of the page…

Anyone had the some problem?

The problem is when I use q-tab and q-tab-pane because with q-route-tab seems work everything ok.

I’m using quasar v0.14.7

I follow the quasar documentation and code this small example:

<template>
  <q-layout ref="layout" reveal>
   
    <q-toolbar slot="header">
      <q-toolbar-title> test </q-toolbar-title>
    </q-toolbar>

    <q-tabs slot="navigation">
      <q-tab  name="test" slot="title" label="test" />
      <q-tab-pane name="test">
        <div class="row" v-for="i in 10000">
            {{i}}
        </div>
      </q-tab-pane>
    </q-tabs>
    
  </q-layout>
</template>