<script>
export default {
data() {
return {
app_height: 0
};
},
onLoad() {
const _this = this;
uni.getSystemInfo({
success: res => {
console.log('手机可用高度:' + res.windowHeight * 2 + 'rpx');
_this.app_height = res.windowHeight * 2;
}
});
},
methods: {}
};
</script>
获取高度后记得要*2(将px转换成rpx)
<template>
<view>
<view :style="{ height: this.app_height * 0.5 + 'rpx' }">高度为屏幕的一半</view>
</view>
</template>
使用时在view的:style里设定高度即可,这样就把总高度设定为50%了
参考于:uni-app 移动端高度自适应