微信小程序——px和rpx单位转换

小程序新加了rpx这个单位,它可以根据屏幕宽度进行自适应。但是某些组件属性或者api只接收px单位的数字。
文档:
在这里插入图片描述
所以,根据文档规则,我写了个转换函数:

	
	// rpx 转换为 px ,传参类型是数字(Number)
    rpxTorpx(rpx){
        let deviceWidth = wx.getSystemInfoSync().windowWidth;	//获取设备屏幕宽度
        let px = (deviceWidth/750)*Number(rpx);
        return px;
    }
    
    // px 转换为 rpx ,传参类型是数字(Number)
    pxTorpx(px) {
        let deviceWidth = wx.getSystemInfoSync().windowWidth;	//获取设备屏幕宽度
        let rpx = (750 / Number(px)) * deviceWidth;
        return rpx;
    },
发布了8 篇原创文章 · 获赞 10 · 访问量 918

猜你喜欢

转载自blog.csdn.net/weixin_44710964/article/details/104462700