Przeglądaj źródła

refactor(utils): 提取系统信息工具函数到单独文件

将获取系统安全区域信息的逻辑从页面组件中提取到独立的工具文件,提高代码复用性
同时更新相关依赖版本
feige996 8 miesięcy temu
rodzic
commit
cf506da2aa
3 zmienionych plików z 83 dodań i 42 usunięć
  1. 44 20
      pnpm-lock.yaml
  2. 1 22
      src/pages/index/index.vue
  3. 38 0
      src/utils/systemInfo.ts

Plik diff jest za duży
+ 44 - 20
pnpm-lock.yaml


+ 1 - 22
src/pages/index/index.vue

@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 <script lang="ts" setup>
 import { LOGIN_PAGE } from '@/router/config'
 import { LOGIN_PAGE } from '@/router/config'
 import { useThemeStore } from '@/store'
 import { useThemeStore } from '@/store'
+import { safeAreaInsets } from '@/utils/systemInfo'
 
 
 defineOptions({
 defineOptions({
   name: 'Home',
   name: 'Home',
@@ -17,28 +18,6 @@ definePage({
 
 
 const themeStore = useThemeStore()
 const themeStore = useThemeStore()
 
 
-// 获取屏幕边界到安全区域距离
-let safeAreaInsets
-let systemInfo
-
-// #ifdef MP-WEIXIN
-// 微信小程序使用新的API
-systemInfo = uni.getWindowInfo()
-safeAreaInsets = systemInfo.safeArea
-  ? {
-      top: systemInfo.safeArea.top,
-      right: systemInfo.windowWidth - systemInfo.safeArea.right,
-      bottom: systemInfo.windowHeight - systemInfo.safeArea.bottom,
-      left: systemInfo.safeArea.left,
-    }
-  : null
-// #endif
-
-// #ifndef MP-WEIXIN
-// 其他平台继续使用uni API
-systemInfo = uni.getSystemInfoSync()
-safeAreaInsets = systemInfo.safeAreaInsets
-// #endif
 const author = ref('菲鸽')
 const author = ref('菲鸽')
 const description = ref(
 const description = ref(
   'unibest 是一个集成了多种工具和技术的 uniapp 开发模板,由 uniapp + Vue3 + Ts + Vite5 + UnoCss + VSCode 构建,模板具有代码提示、自动格式化、统一配置、代码片段等功能,并内置了许多常用的基本组件和基本功能,让你编写 uniapp 拥有 best 体验。',
   'unibest 是一个集成了多种工具和技术的 uniapp 开发模板,由 uniapp + Vue3 + Ts + Vite5 + UnoCss + VSCode 构建,模板具有代码提示、自动格式化、统一配置、代码片段等功能,并内置了许多常用的基本组件和基本功能,让你编写 uniapp 拥有 best 体验。',

+ 38 - 0
src/utils/systemInfo.ts

@@ -0,0 +1,38 @@
+/* eslint-disable import/no-mutable-exports */
+// 获取屏幕边界到安全区域距离
+let systemInfo
+let safeAreaInsets
+
+// #ifdef MP-WEIXIN
+// 微信小程序使用新的API
+systemInfo = uni.getWindowInfo()
+safeAreaInsets = systemInfo.safeArea
+  ? {
+      top: systemInfo.safeArea.top,
+      right: systemInfo.windowWidth - systemInfo.safeArea.right,
+      bottom: systemInfo.windowHeight - systemInfo.safeArea.bottom,
+      left: systemInfo.safeArea.left,
+    }
+  : null
+// #endif
+
+// #ifndef MP-WEIXIN
+// 其他平台继续使用uni API
+systemInfo = uni.getSystemInfoSync()
+safeAreaInsets = systemInfo.safeAreaInsets
+// #endif
+
+console.log('systemInfo', systemInfo)
+// 微信里面打印
+// pixelRatio: 3
+// safeArea: {top: 47, left: 0, right: 390, bottom: 810, width: 390, …}
+// safeAreaInsets: {top: 47, left: 0, right: 0, bottom: 34}
+// screenHeight: 844
+// screenTop: 91
+// screenWidth: 390
+// statusBarHeight: 47
+// windowBottom: 0
+// windowHeight: 753
+// windowTop: 0
+// windowWidth: 390
+export { safeAreaInsets, systemInfo }