utils.js
let systemInfo = null;
export const getSystemInfo = () => {
if (!systemInfo) {
systemInfo = uni.getSystemInfoSync();
// 补充安全区域默认值
systemInfo.safeAreaInsets = systemInfo.safeAreaInsets || {
top: 0,
bottom: 0,
left: 0,
right: 0
};
// 确保statusBarHeight存在(兼容旧版本)
systemInfo.statusBarHeight = systemInfo.statusBarHeight ||
(systemInfo.platform === 'android' ? 25 : 20);
}
return systemInfo;
};
// 获取状态栏高度(px)
export const getStatusBarHeight = () => getSystemInfo().statusBarHeight;
// 获取iPhone底部下巴高度(px)
export const getIphoneBottomHeight = () => {
const { platform, safeAreaInsets } = getSystemInfo();
return platform === 'ios' ? safeAreaInsets.bottom : 0;
};
// 是否全面屏设备
export const isNotchScreen = () => {
const { model, statusBarHeight } = getSystemInfo();
return statusBarHeight > 20 || /iphone x|iphone 1[1-5]/i.test(model);
};
import { getSystemInfo, getStatusBarHeight, getIphoneBottomHeight } from '@/utils/device';
computed: {
// 底部安全区域高度(单位:px)
bottomSafeArea() {
return getIphoneBottomHeight();
},
// 转换为rpx单位
bottomSafeAreaRpx() {
return this.bottomSafeArea * (750 / this.deviceInfo.windowWidth);
}
},
created() {
// 获取设备状态栏高度
const { statusBarHeight } = uni.getSystemInfoSync();
this.navBarHeight = statusBarHeight;
},