关于uniapp 全屏尺寸适配

s获取屏幕高度

onReady() {
    uni.getSystemInfo({
        success(res) {
            let screenHeight = res.screenHeight
            let height = ''
            //.box获取class为box的元素，如果使用的id= 'box' 则使用'#box'
            uni.createSelectorQuery().select('.padingLR_1rem').boundingClientRect(data => {
                console.log('data.height',data.height);
                height = screenHeight - data.height
                console.log(height)
            }).exec()
        }
    })
},

我这里使用的机型是

转化为 rpx 比 1：2

所以计算出来全屏100rpx

<template>
	<view>
		<view class="padingLR_1rem padingTB_05rem" style="background-color: #FFFFFF;">
			<u-search placeholder="按台区名称搜索" :animation="true" v-model="queryTaskName" @search="searchTaskName"
				@custom="searchTaskName"></u-search>
		</view>
		<view class="map_content" style="display: flex;flex-direction: column;">
			<map id="myMap" :style="{width: '100%', height: 'calc(100vh - 100rpx)'}" :show-location='true' :latitude="latitude"
				:longitude="longitude" :markers="marker" :scale="scale"></map>
			<view class="showDeviceListCard" style=""></view>
		</view>
		
	</view>
</template>

calc(100vh - 100rpx) 用来计算很适合。

上面主要俩个模块 一个搜索一个地图；高度占比 为100vh即可

实例：