upx

uni-app 使用 upx 做爲默認尺寸單位， upx 是相對於基準寬度的單位，能夠根據屏幕寬度進行自適應。uni-app 規定屏幕基準寬度750upx。

開發者能夠經過設計稿基準寬度計算頁面元素 upx 值，設計稿 1px 與框架樣式 1upx 轉換公式以下：

設計稿 1px / 設計稿基準寬度 = 框架樣式 1upx / 750upx

舉例說明：

1. 若設計稿寬度爲 640px，元素 A 在設計稿上的寬度爲 100px，那麼元素 A 在 uni-app 裏面的寬度應該設爲：750 * 100 / 640，結果爲：117upx。
2. 若設計稿寬度爲 375px，元素 B 在設計稿上的寬度爲 200px，那麼元素 B 在 uni-app 裏面的寬度應該設爲：750 * 200 / 375，結果爲：400upx。

一、動態綁定的 style 不支持直接使用 upx。

<!-- - 靜態upx賦值生效 -->
<view class="test" style="width:200upx"></view>
<!-- - 動態綁定不生效 -->
<view class="test" :style="{width:winWidth + 'upx;'}"></view>

　　

二、使用 uni.upx2px(Number) 轉換爲 px 後再賦值。

<template>
    <view>
        <view  :style="{width: h_Width}">
        </view>
    </view>
</template>

<script>
    export default {
        computed: {
            h_Width() {
                return uni.upx2px(750 / 2) + 'px';
            }
        }
    }
</script>