Reply To: v-tabs-window-item shows content of the tab clicked + other content

Solution:

The issue occurs due to a typo in the code. While VS Code does not highlight this as a syntax error, a closer look reveals that only one of the <v-tabs-window-item> elements is correctly used. The other elements incorrectly use the tag <v-tab-window-item>. These incorrectly used tags display their content at all times, causing the content of other tabs to appear below the first tab’s content.

Here is the corrected code:

<v-tabs v-model=”tab” bg-color=”#2e76bc” color=”white”>
<v-tab v-for=”item in tabItems” :key=”item”>{{ item }}</v-tab>
</v-tabs>

<v-tabs-window v-model=”tab”>
<v-tabs-window-item></v-tabs-window-item>
<v-tabs-window-item></v-tabs-window-item>
<v-tabs-window-item></v-tabs-window-item>
</v-tabs-window>