4***@qq.com
4***@qq.com
  • 发布:2019-10-21 14:42
  • 更新:2019-10-21 15:14
  • 阅读:2279

有办法在js中计算比较px 和 rpx吗?

分类:uni-app

页面的最后一个card想要做成自适应填充目前,采用的方法是获取该组件距离顶部的高度,在用windowHeight将其减去,就获取到剩下的高度 myServiceClass.height
但这里都是px为单位进行计算。我想要 myServiceClass.height若低于200rpx,则采用200rpx为高度。这边需要在js中比较px和rpx,不知道怎么进行比较

        onLoad() {  
            this.height = uni.getSystemInfoSync().windowHeight  
        },  
        onReady () {  
            let view = uni.createSelectorQuery().in(this).select("#my-service")  
            view.boundingClientRect(data => {  

                this.myServiceClass = this.height - data.top - 10  
            }).exec()  
        },
2019-10-21 14:42 负责人:无 分享
已邀请:
IT梅

IT梅 - 一个前端开发者

flex布局,最底部盒子自适应,除了自适应的,都写固定高度,最后一个盒子设置flex1即可,demo如下

<template>  
    <view class="big-box">  
        <view class="top"></view>  
        <view class="center"></view>  
        <view class="bottom"></view>  
    </view>  
</template>
<style>  

    .big-box{  
        height: 100vh;  
        display: flex;  
        justify-content: space-between;  
        flex-direction: column;  
    }  
    .top{  
        background-color: #f00;  
        height: 200rpx;  
    }  
    .center{  
        background-color: #0f0;  
        height: 300rpx;  
    }  
    .bottom{  
        background-color: #00f;  
        flex: 1;  
    }  

</style>
DCloud_UNI_HT

DCloud_UNI_HT

rpx 单位 = px单位 / 屏幕宽度 * 750

该问题目前已经被锁定, 无法添加新回复