更改功德箱未显示完

src/App.vue

@@ -2,8 +2,8 @@
     <div class="app-safe-area" :style="{minHeight: minHeight + 'px'}">
         <div id="app" :data-height="minHeight - tabHeight" :style="{ minHeight: minHeight - tabHeight + 'px', paddingBottom: tabHeight + 'px'}">
             <router-view />
-            <van-tabbar v-if="showTabbar" class="tabbar" ref="tabbar" route active-color="#CF9E3B" inactive-color="#999">
-                <van-tabbar-item replace name v-for="(tab, index) in tabbar" :key="index" :to="tab.path">
+            <van-tabbar v-if="showTabbar" class="tabbar" v-model="actionRoute" ref="tabbar" active-color="#CF9E3B" inactive-color="#999">
+                <van-tabbar-item replace name v-for="(tab, index) in tabbar" :key="index" @click="onNavigation(tab)">
                     <span>{{ tab.title }}</span>
                     <template #icon="props">
                         <img :src="props.active ? tab.active: tab.inactive" alt="">
@@ -25,6 +25,7 @@ export default {
             minHeight: 0,
             tabbar,
             tabHeight: 0,
+            // actionRoute: 0
         };
     },
     provide() {
@@ -56,22 +57,33 @@ export default {
         }
     },
     mounted(){
-        console.log('launch', this.$route.query)
         this.$store.commit('SET_LAUNCH', this.$route.query)
-
-        console.log( safeAreaInsets.bottom)
         setTimeout(() => {
-            console.log( safeAreaInsets.bottom)
             this.minHeight = window.innerHeight - safeAreaInsets.bottom;
         }, 30)
     },
+    methods: {
+        onNavigation(tab){
+            const { path } = this.$route;
+            if(path === tab.path) return;
+            this.$router.push({ path: tab.path, query: { temple_id: this.$route.query.temple_id}})
+        }
+    },
     computed: {
+        actionRoute: {
+            get(){
+                const { tabbar } = this;
+                return tabbar.map(tab => tab.name).indexOf(this.$route.name)
+            },
+            set(){ }
+        },
         showTabbar() {
             const path = tabbar.map(tab => tab.path);
-            const { name, query: { temple_id } } = this.$route;
+            const { name, query: { temple_id, hideTab } } = this.$route;
 
             // 等于寺庙功德箱时隐藏底部导航
-            if(name === 'merit-box' && temple_id !== '1'){
+            console.log(name,  temple_id !== '1')
+            if(name === 'merit-box' || (name === 'temple-list' && hideTab === '1')){
                 return false
             }