Fixed swiping between tabs when spells tab is hidden

app/imports/ui/creature/character/CharacterSheet.vue

@@ -1,4 +1,4 @@
-<template>
+if<template>
   <div class="character-sheet fill-height">
     <v-fade-transition mode="out-in">
       <div
@@ -35,6 +35,10 @@
         class="fill-height"
       >
         <v-tabs-items
+          :key=" '' +
+            creature.settings.hideSpellsTab +
+            creature.settings.showTreeTab
+          "
           :value="$store.getters.tabById($route.params.id)"
           class="card-background"
           @change="e => $store.commit(
@@ -51,13 +55,17 @@
           <v-tab-item>
             <inventory-tab :creature-id="creatureId" />
           </v-tab-item>
-          <v-tab-item v-show="!creature.settings.hideSpellsTab">
+          <v-tab-item
+            v-if="!creature.settings.hideSpellsTab"
+          >
             <spells-tab :creature-id="creatureId" />
           </v-tab-item>
           <v-tab-item>
             <character-tab :creature-id="creatureId" />
           </v-tab-item>
-          <v-tab-item v-if="creature.settings.showTreeTab">
+          <v-tab-item
+            v-if="creature.settings.showTreeTab"
+          >
             <tree-tab :creature-id="creatureId" />
           </v-tab-item>
         </v-tabs-items>

app/imports/ui/creature/character/CharacterSheetToolbar.vue

@@ -80,6 +80,10 @@
       >
         <v-tabs
           v-if="creature && creature.settings"
+          :key=" '' +
+            creature.settings.hideSpellsTab +
+            creature.settings.showTreeTab
+          "
           class="flex"
           style="min-width: 0"
           centered
@@ -102,7 +106,7 @@
           <v-tab>
             Inventory
           </v-tab>
-          <v-tab v-show="!creature.settings.hideSpellsTab">
+          <v-tab v-if="!creature.settings.hideSpellsTab">
             Spells
           </v-tab>
           <v-tab>
@@ -134,13 +138,13 @@ import getThemeColor from '/imports/ui/utility/getThemeColor.js';
 import SharedIcon from '/imports/ui/components/SharedIcon.vue';
 
 export default {
-  inject: {
-    context: { default: {} }
-  },
   components: {
     CharacterSheetFab,
     SharedIcon,
   },
+  inject: {
+    context: { default: {} }
+  },
   computed: {
     creatureId(){
       return this.$route.params.id;