PWA支持

Web/src/App.vue

@@ -1,7 +1,7 @@
 <template>
   <van-config-provider :theme="theme">
     <RouterView />
-    <van-tabbar v-model="active" v-show="showTabbar">
+    <van-tabbar v-model="active" v-show="showTabbar" safe-area-inset-bottom>
       <van-tabbar-item icon="notes-o" to="/calendar">
         日历
       </van-tabbar-item>
@@ -61,3 +61,19 @@ const handleTabClick = (path) => {
 
 </script>
 
+<style scoped>
+/* 为 Tabbar 添加额外的底部安全区域适配 */
+:deep(.van-tabbar) {
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* 在原有高度基础上增加安全区域 */
+  height: calc(50px + constant(safe-area-inset-bottom));
+  height: calc(50px + env(safe-area-inset-bottom));
+}
+
+/* 确保内容不被 Tabbar 遮挡 */
+:deep(.van-tabbar) + * {
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+}
+</style>