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

Share Improve this question Follow edited Jan 4, 2023 at 23:26 Riza Khan 3,17055 gold badges2828 silver badges6363 bronze badges asked Nov 21, 2019 at 2:18 BillBill 1,48722 gold badges3434 silver badges6666 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

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;