I have the following code for a v-tabs control:

</v-tabs>
  <v-tab
    disabled
    v-for="tab of tabs"
    :key="tab.index"
    v-on:change="tabSelected(tab.index)">
    {{tab.name}}
  </v-tab>
</v-tabs>

The tabs are disabled when the app starts. They are disabled until the user selects an item that will fill the tabs with data. Once the data is displayed the tabs need to bee active. I would like to add code to a button click that gets the data and will also allow the tab to bee active.

I have the following code for a v-tabs control:

</v-tabs>
  <v-tab
    disabled
    v-for="tab of tabs"
    :key="tab.index"
    v-on:change="tabSelected(tab.index)">
    {{tab.name}}
  </v-tab>
</v-tabs>

The tabs are disabled when the app starts. They are disabled until the user selects an item that will fill the tabs with data. Once the data is displayed the tabs need to bee active. I would like to add code to a button click that gets the data and will also allow the tab to bee active.

• javascript
• vue.js
• vuetify.js

1 Answer 1

Got it- I added binding to disabled

           <v-tab
            :disabled="isDisabled"
            v-for="tab of tabs"
            :key="tab.index"
            v-on:change="tabSelected(tab.index)"
          >{{tab.name}}</v-tab>
        </v-tabs>

Then on the button click

       this.isDisabled = false;