胶囊高度适配

src/components/Container.vue

@@ -7,7 +7,7 @@ import ScreenHint from "@/components/ScreenHint.vue";
 import BackToGame from "@/components/BackToGame.vue";
 import { getCurrentGameAPI } from "@/apis";
 import { debounce } from "@/util";
-defineProps({
+const props = defineProps({
   title: {
     type: String,
     default: "",
@@ -41,9 +41,9 @@ defineProps({
     default: true,
   },
 });
-const isIos = ref(true);
 const showHint = ref(false);
 const hintType = ref(0);
+const capsuleHeight = ref(0);
 const showGlobalHint = (type) => {
   hintType.value = type;
   showHint.value = true;
@@ -52,8 +52,8 @@ const hideGlobalHint = () => {
   showHint.value = false;
 };
 onMounted(() => {
-  const deviceInfo = uni.getDeviceInfo();
-  isIos.value = deviceInfo.osName === "ios";
+  const menuBtnInfo = uni.getMenuButtonBoundingClientRect();
+  capsuleHeight.value = menuBtnInfo.top - 9;
 });
 onUnmounted(() => {
   // const pages = getCurrentPages();
@@ -74,7 +74,7 @@ const goBack = () => {
 </script>
 
 <template>
-  <view>
+  <view :style="{ paddingTop: capsuleHeight + 'px' }">
     <AppBackground :type="bgType" :bgColor="bgColor" />
     <Header
       v-if="!isHome"
@@ -86,7 +86,7 @@ const goBack = () => {
     <view
       class="content"
       :style="{
-        height: isHome ? '100vh' : `calc(100vh - ${isIos ? 190 : 160}rpx)`,
+        height: `calc(100vh - ${capsuleHeight + (isHome ? 0 : 50)}px)`,
         overflow,
       }"
     >