fix: 替换已弃用的 getSystemInfoSync API 并优化移动端布局

- 将所有 uni.getSystemInfoSync() 替换为新的推荐 API
  - uni.getDeviceInfo() 获取设备信息
  - uni.getWindowInfo() 获取窗口信息
  - uni.getAppBaseInfo() 获取应用基础信息
- 优化页面布局适配移动端小程序
  - page 添加 height: 100% 和 overflow: hidden
  - 主页面使用 height: 100vh 替代 min-height
  - 移除滚动条显示(::-webkit-scrollbar)
  - 添加 flex-shrink: 0 防止卡片收缩
- 修复隐藏滚动条,提升移动端体验

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-07 18:27:04 +08:00
parent 130f532116
commit b9473d5059
10 changed files with 49 additions and 29 deletions
+17 -10
View File
@@ -11,10 +11,15 @@ onLaunch(async () => {
console.log('App Launch')
const store = useAppStore()
await store.initialize()
const systemInfo = uni.getSystemInfoSync()
statusBarHeight.value = systemInfo.statusBarHeight || 20
safeAreaTop.value = systemInfo.safeAreaInsets?.top || systemInfo.statusBarHeight || 20
safeAreaBottom.value = systemInfo.safeAreaInsets?.bottom || 0
// 使用新的推荐 API 替代已弃用的 getSystemInfoSync
const deviceInfo = uni.getDeviceInfo()
const windowInfo = uni.getWindowInfo()
const appBaseInfo = uni.getAppBaseInfo()
statusBarHeight.value = windowInfo.statusBarHeight || 20
safeAreaTop.value = windowInfo.safeAreaInsets?.top || windowInfo.statusBarHeight || 20
safeAreaBottom.value = windowInfo.safeAreaInsets?.bottom || 0
uni.setStorageSync('statusBarHeight', statusBarHeight.value)
uni.setStorageSync('safeAreaTop', safeAreaTop.value)
uni.setStorageSync('safeAreaBottom', safeAreaBottom.value)
@@ -35,8 +40,9 @@ page {
background-color: #0F071A;
color: #F3E8FF;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
padding-top: 0;
padding-bottom: 0;
height: 100%;
overflow: hidden;
-webkit-overflow-scrolling: touch;
}
/* 星空背景 */
@@ -235,16 +241,17 @@ page {
}
::-webkit-scrollbar {
width: 4rpx;
width: 0;
height: 0;
display: none;
}
::-webkit-scrollbar-thumb {
background: rgba(168, 85, 247, 0.3);
border-radius: 10rpx;
background: transparent;
}
::-webkit-scrollbar-track {
background: rgba(168, 85, 247, 0.05);
background: transparent;
}
@keyframes fadeIn {