Dynamic q-tab

[wilcorrea]

Software version

Quasar: v0.13.9
OS: Ubuntu 14.04
Node: v7.3.0
NPM: 3.10.10
Browsers: Chrome
iOS: N/A
Android: N/A
Any other software related to your bug:

What did you get as the error?

Im trying use the tabs with dynamic contents

What were you expecting?

The component rendered without errors

What steps did you take, to get the error?

I just create an array and used v-for to mount the markup

<template>
  <div>
    <q-tabs v-for="__tab in tabs" :refs="$refs">
      <q-tab :name="__tab.value" icon="message">
        {{ __tab.label }}
      </q-tab>
    </q-tabs>
    <div v-for="__tab in tabs" :ref="__tab.value">
      {{ __tab.label }}
    </div>
  </div>
</template>

<script>
  export default {
    data: () => ({
      tabs: [
        {
          value: 'test',
          label: 'Test'
        }
      ]
    })
  }
</script>

<style lang="stylus">
</style>

The output of console. The component cant manage the divs what will be displayed. I believe what the refs are the problem. Any suggestion?

[rstoenescu]

Hi, this is obsolete now. Tabs have been completely reworked in v0.14.

[wilcorrea]

Thnks 👍

[rstoenescu]

I just noticed... you are using v-for on <q-tabs> and NOT on <q-tab>...